2.JQuery的基本使用

在http://jquery.com下载代码

点击DOwnload下载

 

 我用的是vscode软件,然后新建一个空白js文件

复制js代码进去

2.3JQuery的入口函数

这个比较简单的代码表示

$(function(){

...//此处是页面DOM加载完成的入口

});

$(document).ready(function(){

...//此处是页面DOM加载完成的入口

});

1.等着DOM结构渲染完毕即可执行内部代码,不必等到所有外部资源加载完成,JQuery帮我们完成了封装。

2.相当于原生js中的DOMContentLoaded

3.不同于原生js中的load事件是等页面文档,外部的js文件,css文件,图片加载完毕才执行内部代码。

实验

建立一个html文件

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="jquery.min.js"></script>
    <style>
        div {
            width: 200px;
            height: 200px;
            background-color: pink;
        }
    </style>
</head>

<body>

    <script>
        // $('div').hide();
        // 1.等着页面DOM加载完毕再去执行js代码
        // $(document).ready(function() {
        //     $('div').hide();
        // })
        //2.等着页面DOM加载完毕再去执行js代码

        $(function() {
            $('div').hide();
        })
    </script>
    <div></div>
</body>

</html>

 2.4jQuery的顶级对象$

1.$是jQuery的别称,在代码中可以使用jQuery代替$,但一般为了方便,通常都直接使用$.

2.$是jQuery的顶级对象,相当于原生JavaScript中的window,把元素利用$包装成jQuery对象,就是调用jQuery的方法

实验

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="jquery.min.js"></script>
    <style>
        div {
            width: 200px;
            height: 200px;
            background-color: pink;
        }
    </style>

</head>

<body>
    <div></div>
    <script>
        //1.$是jQuery的别称(另外的名字)
        // $(function() {
        //     alert(11)
        // });
        jQuery(function() {
            // alert(11)
            //$('div').hide();
            jQuery('div').hide();
        });
        //2.$同时也是JQuery的顶级对象
    </script>
</body>

</html>
posted @ 2022-06-11 23:59  齐天ldj  阅读(23)  评论(0编辑  收藏  举报