DOM对象
使用JavaScript中的方法获取页面中的元素返回的对象就是DOM对象。比如使用document.getElementBy*()系列的方法返回的就是DOM对象。
var btn = document.getElementById("btnShowDiv"); var divs = document.getElementsByTagName("div");
dom对象只可以使用dom对象的方法和属性
domObject.innerHTML = "dom对象设置文本"; domObject.style.display= "block"; //dom对象显示对象 domObject.onclick = function() {} //dom对象绑定事件
jQuery对象
jQuery对象就是使用jQuery的方法获取页面中的元素返回的对象就是jQuery对象。比如使用$()方法返回对象都是jQuery对象。
$("div"); //标签选择器返回的jquery对象。 $("#btnShowDiv"); //id选择器返回的jquery对象。
jQuery对象只能使用jquery对象的方法
var $obj = $("div"); $obj.html("jquery对象设置文本的方法"); $obj.show(); //jquery对象显示文本 $obj.click(function() {}); //jquery对象绑定事件
对象方法不能相互调用
$("div").innerHTML; //jquery对象不能调用dom方法
document.getElementById("btnShowDiv").show(); //dom对象不能调用jquery方法。
深入了解jQuery对象
jQuery
对象其实就是DOM对象的包装集(包装了DOM对象的集合),简单点说就是DOM对象是jQuery对象的子集
jQuery对象和DOM对象的相互转换
1.jQuery对象转DOM对象
var $li = $(“li”); //第一种方法(推荐使用) $li[0]
//第二种方法 $li.get(0)
//其实jQuery对象转DOM对象的实质就是取出jQuery对象中封装的DOM对象。
2.DOM对象转jQuery对象
var $obj = $(domObj); // $(document).ready(function(){});就是典型的DOM对象转jQuery对象