jQueryDOM节点操作

JavaScript中的DOM对象
例如：document.getElementById(“box”);DOM对象
在JQuery库中，可以通过本身自带的方法获取页面元素的对象叫做JQurey对象
$(".box");//jQuery对象
DOM对象与jQuery对象的区别
1.DOM对象是通过原生的JS获取的对象，DOM对象只能使用JS中的方法和属性
2.jQuery对象是通过jQuery包装DOM对象后产生的对象，它是jQuery独有的。
jQuery可以使用jQuery库里面的方法，但是不能使用JS中的方法
js中window.onload事件
window.onload = function () {
通过原生的JS代码获取DOM对象
var box = document.getElementById(“box”);
console.log(box);/js中的DOM对象
通过对象的属性修改对象的样式
box.style.width = “400px”;
box.innerHTML = “这是一个JS对象”;
}
jQuery中页面加载事件
$(document).ready(function () {
通过jQuery语法获取id为jqBox的元素获得一个jQuery对象
调用该对象的html()方法进行更改内容
调用该对象的css()方法进行更改颜色样式
var $box = KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲jqBox");/jQuery…box);
$box.css(“width”, “400px”);
$box.html(“这是一个jQuery对象”);
链式写法
KaTeX parse error: Expected 'EOF', got '#' at position 3: ("#̲jqBox").css("wi…(参数)是一个多功能的方法，
通过传递不同的参数而产生不同的作用。
如果传递给 $(DOM)函数的参数是一个DOM对象，jQuery方法会把这个DOM对象给包装成一个新的jQuery对象 通过$(dom)方法将普通的dom对象加工成jQuery对象之后，我们就可以调用jQuery的方法了
1.DOM对象转换为jQuery对象
var box = document.getElementById(“box”);//DOM对象
$(box);/jQuery对象
2.jQuery对象转换为一个DOM对象
var $divs=$(“div”);/jQuery对象 divs中包含所有的 $divs元素 var div=$divs[0];/div为DOM对象
使用jQuery中的get()方法进行转换，只需要提供一个索引就可以了
var div= $divs.get(0);//将$divs对象中索引为0的元素转换为DOM对象
$(document).ready(function () {
通过原生的JS代码获取DOM对象
var box = document.getElementById(“box”);/dom对象
var jqBox = $(box);/jquery对象
var $box = $("#jqBox");/jQuery中的对象
var div = $box[0];/DOM对象
var div = $box.get(0);/DOM对象
})