【jQuery】-- 基本使用步骤

最新推荐文章于 2024-04-07 16:34:13 发布

愛 / 滥 / 時

最新推荐文章于 2024-04-07 16:34:13 发布

阅读量827

点赞数 2

分类专栏： jQuery 前端 JavaScript 文章标签： jquery javascript 前端

本文链接：https://blog.csdn.net/qq_48802092/article/details/126590586

版权

jQuery是一个Javascript库，是对于ECMAScript、dom、bom的一个浅封装，让用户更方便操作。

♡ ‧₊˚ jQUery的安装 ‧₊˚ ♡

在 https://www.bootcdn.cn/jquery/ 中：

从网页引入

找到需要的版本并复制相应的script标签，放到自己的html文件中即可。

  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>

从本地引入

复制链接到搜索框打开一个新的网页，将页面中出现的代码全选复制到自己的jquery.js文件中，并用script标签引入到html中

  <script src="./jquery.js"></script>

♡ ‧₊˚ jQUery函数 ‧₊˚ ♡

通过"jQuery"和"$"来调用jQuery函数

jQuery核心函数：
简称:jQuery函数（$/jQuery）
引入jQuery库以后，直接使用$/jQuery即可
当函数用:$(params)
当对象用的时候:$.each()
jQuery核心对象：
简称:jQuery对象 $()
得到jQuery对象：执行jQuery函数返回的就是jQuery对象
使用jQuery对象:$obj.xxx()

        console.log($,'jQuery函数', typeof $); // 'jQuery函数' 'function'
        console.log($(),'jQuery对象', typeof $()); // 'jQuery对象' 'object'
        console.log($() instanceof Object); // true

入口函数

JS的入口函数：

        // 原生JS入口函数
        window.onload = function(){
            alert('我是入口函数')
        }

jQuery的入口函数有四种不同的写法：

        // JQ入口函数的四种写法
        $(document).ready(function(){
            alert('我是入口函数1')
        })
        jQuery(document).ready(function(){
            alert('我是入口函数2')
        })
        // 推荐写法
        $(function(){
            alert('我是入口函数3')
        })
        jQuery(function(){
            alert('我是入口函数4')
        })

♡ ‧₊˚ jQUery对象 ‧₊˚ ♡

jQuery对象是类数组对象，jQuery的方法都是对类数组中的元素的批量操作

注意：jQuery对象可以调用jQuery.prototype中声明的方法，普通的Element元素则不能调用。在使用jquery的时候，拿到一个对象务必要搞明白该对象是Element元素还是jQuery实例

如下代码，this是Element元素，如果想调用jQuery方法，需要使用$()将其转换为jQuery实例

<head>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/

最低0.47元/天解锁文章

愛 / 滥 / 時

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
【jQuery】-- 基本使用步骤

jQuery对象是类数组对象，jQuery的方法都是对类数组中的元素的批量操作注意：jQuery对象可以调用jQuery.prototype中声明的方法，普通的Element元素则不能调用。在使用jquery的时候，拿到一个对象务必要搞明白该对象是Element元素还是jQuery实例如下代码，this是Element元素，如果想调用jQuery方法，需要使用$()将其转换为jQuery实例...
复制链接

扫一扫

专栏目录