编程 Javascript

浅谈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.[]的区别全部内容了，希望大家多多支持三水点靠木~

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

- Author -

jingxian

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

setTimeout 不断吐食CPU的问题分析

Apr 01 Javascript

JS中用户登录系统的解决办法

Apr 15 Javascript

jquery队列函数用法实例

Dec 16 Javascript

基于JS实现EOS隐藏错误提示层代码

Apr 25 Javascript

避免jQuery名字冲突 noConflict()方法

Jul 30 Javascript

BOM系列第一篇之定时器setTimeout和setInterval

Aug 17 Javascript

微信公众平台开发教程（五）详解自定义菜单

Dec 02 Javascript

AngularJS实现进度条功能示例

Jul 05 Javascript

微信小程序富文本渲染引擎的详解

Sep 30 Javascript

详解Vue-Router源码分析路由实现原理

May 15 Javascript

微信小程序实现底部弹出模态框

Nov 18 Javascript

Javascript webpack动态import

Apr 19 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