JQuery对象和JS对象区别与转换
JQuery对象在操作时，更加方便。
JQuery对象和js对象方法是不通用的
两者相互转换
JQuery - - >js : JQuery对象[索引] 或者 JQuery对象.get(索引)
js - - > JQuery ：$(js对象)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>JQuery对象和JS对象区别与转换</title>
<script src="js/jquery-3.3.1.min.js"></script>
</head>
<body>
<div id="div1">div1...</div>
<div id="div2">div2...</div>
<script>
//通过js方式来获取名称叫jiv的所有html元素对象
var divs = document.getElementsByTagName("div");
alert(divs.length);//可以将其当做数组来使用
//对divs中所有的div 让其标签体内容变为"aaa"
for (var i = 0; i <divs.length; i++) {
// divs[i].innerHTML = "aaa";
//转换
$(divs[i]).html("ccc");
}
//通过JQuery方式来获取名称叫div的所有html元素对象
var $divs = $("div");
alert($divs.length);//也可以当做数组使用
//对divs中所有的div 让其标签体内容变为"bbb" 使用JQuery方式
//$divs.html("bbb");
//转换
$divs[0].innerHTML = "ddd";
$divs.get(1).innerHTML = "eee";
</script>
</body>
</html>
JQuery事件绑定&入口函数&样式控制
入口函数中：window.onload 和 $(function) 区别
window.onload 只能定义一次，如果定义多次，后边的将会将前面的覆盖掉
$(function)可以定义多次的
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>事件绑定</title>
<script src="js/jquery-3.3.1.min.js"></script>
<script>
//给b1按钮添加单击事件
//JQuery入口函数(dom文档加载完成之后执行该函数中的代码)
$(function () {
//获取b1按钮
$("#b1").click(function () {
alert("abc");
});
});
/*样式控制*/
$(function () {
// $("#div1").css("background-color","red");
$("#div1").css("backgroundColor","red");
})
</script>
</head>
<body>
<div id="div1">div1...</div>
<div id="div2">div2...</div>
<input type="button" value="点我" id="b1">
</body>
</html>
搜索
复制
标签：JQuery,function,对象,js,JS,div1 From： https://www.cnblogs.com/pengtianyang/p/16601139.html