浅谈jQuery中的eq()与DOM中element.[]的区别


Posted in Javascript onOctober 28, 2016

如下所示:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>

  <a class="a">#1</a>
  <a class="a">#2</a>
  <a class="a">#3</a>
  <script src="js/jq.js"></script>

  <script>
    var a = $('.a') ;
    var b = $('.a').eq(1) ;
    var c = $('.a')[1];
    var d = $('.a').eq(1)[0];
    var f = $('.a')[0].eq(1);

  </script>
</body>
</html>

$('.a')  // 选择了3个a,都是jq对象(可以用jq的属性、方法)

$('.a').eq(1) // 选择了第二个a,是jq对象(不可以使用dom属性方法,可以用jq的属性、方法)

$('.a')[1]  // 选择了第二个a,是dom对象(可以使用dom属性,方法,不可以使用jq属性方法)

$('.a').eq(1)[0]  // 选择了第二个a,并且转化成都是dom对象(可以使用dom属性,方法,不可以使用jq属性方法)

-----由此可见,jquery将js的又包装了一层,jq属性可以剥开包装调用dom属性,而dom则无法调用jq的属性方法。

$('.a')[0].eq(1) // 错误,因为dom对象用不了jq方法,eq()是jq方法。

以上就是小编为大家带来的浅谈jQuery中的eq()与DOM中element.[]的区别全部内容了,希望大家多多支持三水点靠木~

Javascript 相关文章推荐
bcastr2.0 通用的图片浏览器
Nov 22 Javascript
js 获取服务器控件值的代码
Mar 05 Javascript
js模拟类继承小例子
Jul 17 Javascript
jQuery EasyUI API 中文文档 - EasyLoader 加载器
Sep 29 Javascript
推荐40个非常优秀的jQuery插件和教程【系列三】
Nov 09 Javascript
javascript动画对象支持加速、减速、缓入、缓出的实现代码
Sep 30 Javascript
使用JavaScript动态设置样式实现代码及演示动画
Jan 25 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
Jul 15 Javascript
不使用jquery实现js打字效果示例分享
Jan 19 Javascript
详解javascript中原始数据类型Null和Undefined
Dec 17 Javascript
浅析Javascript中bind()方法的使用与实现
Apr 29 Javascript
自定义Vue中的v-module双向绑定的实现
Apr 17 Javascript
js基础之DOM中document对象的常用属性方法详解
Oct 28 #Javascript
Javascript+CSS3实现进度条效果
Oct 28 #Javascript
js基础之DOM中元素对象的属性方法详解
Oct 28 #Javascript
JavaScript中访问id对象 属性的方式访问属性(实例代码)
Oct 28 #Javascript
JavaScript 轮播图和自定义滚动条配合鼠标滚轮分享代码贴
Oct 28 #Javascript
微信小程序 loading(加载中提示框)实例
Oct 28 #Javascript
使用json来定义函数,在里面可以定义多个函数的实现方法
Oct 28 #Javascript
You might like
也谈php网站在线人数统计
2008/04/09 PHP
PHP模板引擎Smarty的缓存使用总结
2014/04/24 PHP
php计算两个日期相差天数的方法
2015/03/14 PHP
PHP处理数组和XML之间的互相转换
2016/06/02 PHP
php微信开发接入
2016/08/27 PHP
PHP二维数组去重实例分析
2016/11/18 PHP
PDO::errorInfo讲解
2019/01/28 PHP
window.open()弹出居中的窗口
2007/02/01 Javascript
基于jQuery的可以控制左右滚动及自动滚动效果的代码
2010/07/25 Javascript
jquery中通过过滤器获取表单元素的实现代码
2011/07/05 Javascript
jQuery $.extend()用法总结
2014/06/15 Javascript
推荐25个超炫的jQuery网格插件
2014/11/28 Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
2016/12/27 Javascript
微信小程序 缓存(本地缓存、异步缓存、同步缓存)详解
2017/01/17 Javascript
vue实例中data使用return包裹的方法
2018/08/27 Javascript
JavaScript 点击触发复制功能实例详解
2018/11/02 Javascript
vue cli3.0 引入eslint 结合vscode使用
2019/05/27 Javascript
vue项目中实现缓存的最佳方案详解
2019/07/11 Javascript
Node.js 实现简单的无侵入式缓存框架的方法
2019/07/21 Javascript
vue eslint简要配置教程详解
2019/07/26 Javascript
Vue-cli4 配置 element-ui 按需引入操作
2020/09/11 Javascript
Python中正则表达式详解
2017/05/17 Python
对Python 3.2 迭代器的next函数实例讲解
2018/10/18 Python
Python读取excel指定列生成指定sql脚本的方法
2018/11/28 Python
Python 进程之间共享数据(全局变量)的方法
2019/07/16 Python
使用SimpleITK读取和保存NIfTI/DICOM文件实例
2020/07/01 Python
html5实现多图片预览上传及点击可拖拽控件
2018/03/15 HTML / CSS
SHEIN香港:价格实惠的女性时尚服装
2018/08/14 全球购物
Kangol帽子官网:坎戈尔袋鼠
2018/09/26 全球购物
俄罗斯品牌服装和鞋子在线商店:BRIONITY
2020/03/26 全球购物
EJB timer的种类
2014/10/28 面试题
应聘自荐信
2013/12/14 职场文书
毕业自我鉴定总结
2014/03/24 职场文书
机电专业毕业生自我鉴定2014
2014/10/04 职场文书
2015年高三年级组工作总结
2015/07/21 职场文书
导游词之广东佛山(南风古灶)
2019/09/24 职场文书