浅谈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 相关文章推荐
使用javascript获取页面名称
Dec 23 Javascript
jQuery中hasClass()方法用法实例
Jan 06 Javascript
JS读写CSS样式的方法汇总
Aug 16 Javascript
easyui tree带checkbox实现单选的简单实例
Nov 07 Javascript
利用 spin.js 生成等待效果(js 等待效果)
Jun 25 Javascript
Vue内容分发slot(全面解析)
Aug 19 Javascript
Webpack框架核心概念(知识点整理)
Dec 22 Javascript
详解vue-cli中使用rem,vue自适应
May 06 Javascript
html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片
Jan 12 Javascript
详解Webpack抽离第三方类库以及common解决方案
Mar 30 Javascript
OpenLayers3实现地图鹰眼以及地图比例尺的添加
Sep 25 Javascript
js实现详情页放大镜效果
Oct 28 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
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
php+mysqli预处理技术实现添加、修改及删除多条数据的方法
2015/01/30 PHP
一张表搞清楚php is_null、empty、isset的区别
2015/07/07 PHP
Yii框架用户登录session丢失问题解决方法
2017/01/07 PHP
PHP如何防止XSS攻击与XSS攻击原理的讲解
2019/03/22 PHP
JavaScript去掉空格的方法集合
2010/12/28 Javascript
JS简单实现元素复制示例附图
2013/11/19 Javascript
JavaScript实现页面5秒后自动跳转的方法
2015/04/16 Javascript
深入浅析AngularJS中的module(模块)
2016/01/04 Javascript
Jquery元素追加和删除的实现方法
2016/05/24 Javascript
js实现滑动到页面底部自动加载更多功能
2017/02/15 Javascript
浅谈JavaScript作用域和闭包
2017/09/18 Javascript
浅谈React的最大亮点之虚拟DOM
2018/05/29 Javascript
微信小程序实现多选功能
2018/11/04 Javascript
Vue.js实现可排序的表格组件功能示例
2019/02/19 Javascript
js实现图片局部放大效果详解
2019/03/18 Javascript
nodejs搭建本地服务器并访问文件操作示例
2019/05/11 NodeJs
vue-router源码之history类的浅析
2019/05/21 Javascript
React实现全选功能
2020/08/25 Javascript
vue 判断两个时间插件结束时间必选大于开始时间的代码
2020/11/04 Javascript
python正则表达式match和search用法实例
2015/03/26 Python
Python中循环后使用list.append()数据被覆盖问题的解决
2018/07/01 Python
python装饰器常见使用方法分析
2019/06/26 Python
Django 后台获取文件列表 InMemoryUploadedFile的例子
2019/08/07 Python
Python实现某论坛自动签到功能
2019/08/20 Python
Python面向对象之Web静态服务器
2019/09/03 Python
突袭HTML5之Javascript API扩展1—Web Worker异步执行及相关概述
2013/01/31 HTML / CSS
浅谈html5 响应式布局
2014/12/24 HTML / CSS
《唯一的听众》教学反思
2014/02/20 职场文书
经典促销广告词大全
2014/03/19 职场文书
双创工作实施方案
2014/03/26 职场文书
2015年办公室文员工作总结
2015/04/24 职场文书
linux中nohup和后台运行进程查看及终止
2021/06/24 Python
mysql 数据插入优化方法之concurrent_insert
2021/07/01 MySQL
PyTorch中permute的使用方法
2022/04/26 Python
table不让td文字溢出操作方法
2022/12/24 HTML / CSS