jquery学习一_$jqmsvembql0z$-CSDN博客

本文链接：https://blog.csdn.net/qq_34390576/article/details/78107286

jquery是javascript的一个库，它为javascript提供了很大的便利

下面是一个简单的测试

首先要下载一个jquery的文件，它是以.js的格式存在的，同时它还有浏览器兼容的问题，这个百度一下就知道了，这里就不多说了，因为兼容性在不断的提高。

下面中app.js是自己创建的js文件，但它一定要在jquery-3.2.1.min.js下面（也就是你下载回来的那个jquery文件，它可以线上，也可以下载运行的，但建议下载回来），因为html是从上往下执行的，而app.js是依据jquery-3.2.1.min.js才生效的，不然会出现错误。

这是布局代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>JQ</title>
    <script src="jquery-3.2.1.min.js"></script>
    <script src="app.js"></script>
</head>
<body>
    <p>hello/p>
    <p>hello</p>
    <p>hello</p>
    <p class="hello">hello</p>
    <p id="test">hello</p>
    <button>test</button>
</body>
</html>

这是app.js代码

/**
 * Created by Administrator on 2017/9/26.
 */
$(document).ready(function () {
    $("button").click(function () {
        $("p").text("test");
        $(".hello").text("class");
        $("#test").text("he");
    })

})

最后说一下jquery的$是什么：

＂$＂ –> 指标识符，让浏览器知道这是jquery
作为jQuery包装器，利用选择器来选择DOM元素（这个也是最强大的功能）
例如：$(“table tr:nth-child(even)”)
实用工具函数，作为几个通用的实用工具函数的命名空间的前缀
例如：$.trim(someString)
文档就绪处理程序，相当于 $(document).ready(…) 例如：$ (function(){…}); 里面的函数会在DOM树加载完之后执行
创建DOM元素
例如：$(" <p> how are you? </p> ")
扩展jQuery
例如：$.fn.disable = function(){…}
使用jQuery和其他库
例如：Prototype库也是使用 $符号，jQuery提供noConflict函数避免冲突，jQuery.noConflict();把$ 符号还原到非jQuery库定义的含义。