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>原文:https://www.cnblogs.com/yang-wei/p/9534735.html