请教一下:
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对象,两次返回的是两个不同的对象,所以不等