标签：lang html 简化 功能 one doc 汉化 www. odi
jQuery是js的一个库，封装了我们开发过程中常用的一些功能，方便我们调用，提高开发效率。
js库是把我们常用的功能放到一个单独的文件中，我们在用的时候，直接引用到页面里即可。
关于jQuery的相关资料：
在用js写代码的时候，会遇到一些问题：
这些API的共同特点是：几乎全部都是方法。所以，在使用jQuery的API时，都是方法调用，也就是说要加小括号"()"，小括号里面是对应的参数，参数不同，功能不同。
使用原生js来实现下面代码效果：
<!DOCTYPE html>
<html>
<head>
<title>js Demo</title>
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: green;
margin-top: 20px;
display: none;
}
</style>
<script type="text/javascript">
window.onload = function(){
var oBtn = document.getElementsByTagName("button")[0];
var divArr = document.getElementsByTagName("div");
oBtn.onclick = function(){
for(var i = 0; i < divArr.length; i++){
divArr[i].style.display = "block";
divArr[i].innerHTML = "test";
};
}
}
</script>
</head>
<body>
<button>操作</button>
<div></div>
<div></div>
<div></div>
</body>
</html>如果用jQuery来写，保持html和css代码不变，只修改script部分代码：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery Demo</title>
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: green;
margin-top: 20px;
display: none;
}
</style>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(function(){
// 获取DOM元素
var oBtn = $("button"); //根据标签名获取元素
var oDiv = $("div"); //根据标签名获取元素
oBtn.click(function(event) {
oDiv.show(1000); //显示div
oDiv.html("test") //设置内容
}); //事件是通过方法绑定的
})
</script>
</head>
<body>
<button>操作</button>
<div></div>
<div></div>
<div></div>
</body>
</html>标签：lang html 简化 功能 one doc 汉化 www. odi
原文地址：https://www.cnblogs.com/yang-wei/p/9534735.html
