DOM对象和JQuery对象

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对象
原文地址:https://www.cnblogs.com/vichang/p/9413625.html