jQuery对象 vs DOM对象 http://my.oschina.net/u/2312022/blog/724578
jQuery对象与DOM对象的关系：
1.jQuery对象是通过jQuery($())包装DOM对象后产生的对象。
2.jQuery 无法使用DOM对象的任何方法，反之，DOM对象也不能使用jQuery里的方法。
3.共同约定：如果获取的是jQuery对象，那么要在变量之前加上$。
jQuery对象转DOM对象
1.jQuery对象是一个数组对象，可以通过[index]的方法获取DOM对象。
2.使用jQuery中的get(index)方法获取DOM对象。
DOM对象转jQuery对象
1.只需要使用$()将DOM对象包装起来即可。
实例代码如下：
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 |
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>test</title> <!-- 导入 jQuery库 --> <script type="text/javascript" src="jquery-3.1.0.min.js"></script> <script type="text/javascript"> //$(function(){})相当于window.onload $(function(){ //1.选取对象，如:$("对象id") //2.为对象添加响应函数，如：$("对象id").函数 $("button").click(function() { //函数体 alert("Hello world"); //弹出选取对象信息，使用this，这里的this很明显代表的是button alert($(this).text()); //jQuery对象 转 DOM对象 //1.获取一个jQuery对象 var $btn = $("button"); //2.jQuery对象是一个数组 //很明显body里面有两个button，所以这里弹框显示2 alert($btn.length); //3.通过[index]方式获取DOM对象 //很明显btn[0]对应的节点值是 click alert($btn[0].firstChild.nodeValue); //DOM对象 转 jQuery对象 //1.选取一个DOM对象 var btn = document.getElementById("btn"); //2.将DOM对象转成jQuery对象，使用$()进行包装 alert($(btn).text()); }) }) </script> </head> <body> <button id="btn">click</button> <button>click2</button> </body> </html> |
