首页 > 请教一下,为什么使用不同的原生JS方式获取元素,最终得到的是同一个元素节点?

请教一下,为什么使用不同的原生JS方式获取元素,最终得到的是同一个元素节点?

请教一下:
1.为什么使用不同的原生JS方式获取同1个元素最终得到的是同一个元素对象?

2.使用不同的jQuery方式获取同1个元素,得到确不是同一个对象?
(这个问题我的理解是:因为jQuery会首先取得元素,然后构造成1个jQ对象,等于一个新对象。所以同一个元素,用jQ得到的元素对象,都不是来自一个对象)

代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>test</title>
<style>
*{margin: 0; padding: 0;}
div{width: 100px; height: 100px; 
    border:1px solid orange;
}
</style>
<script src="../jquery.js"></script>
</head>
<body>
    <div id="box"></div>
<script>
window.onload=function(){ 
    // js 通过不同的方法来取得div
    var oBox1=document.getElementById('box');
    var oBox2=document.body.children[0];
    /*alert(oBox1==oBox2)  true */

    // jq 通过不同的方式来获得div
    var $Box1=$('#box');
    var $Box2=$('div:first');
    /*alert($Box1==$Box2)  false */
};
</script>    
</body>
</html>

原生js是通过遍历DOM节点获取DOM对象的,不同的方法只是遍历的方式不一样,获取的都是同样DOM对象。
jq中通过$('#box');$('div:first');虽然都使用了$()这个方法来获取对象,但因为参数不同,$()方法进行了重载,其内部其实是new了不同的构造函数,构造函数有着不同的方法和属性,其实例$Box1$Box2也就继承了不同的属性和方法。


js取到的是dom元素,因为是同一个元素,所以相等
jQuery取到的是jQuery对象,两次返回的是两个不同的对象,所以不等

【热门文章】
【热门文章】