jQuery——基本语法与文档就绪函数

最新推荐文章于 2023-03-20 14:15:20 发布

Yeoman92

最新推荐文章于 2023-03-20 14:15:20 发布

阅读量1w

点赞数 2

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

本文链接：https://blog.csdn.net/Yeoman92/article/details/53930414

版权

web前端专栏收录该内容

46 篇文章 0 订阅

订阅专栏

利用jQuery可以将结构(Html)、美化(Css)与交互(JavaScript)的部分有效的分离，从而让页面得到良好的可读性。

利用jQuery开发程序的步骤如下:

将jquery-1.11.3.js 复制到工程的js目录下
在当前页面利用<script>标签引入jquery-1.11.3.js
- 在引入该js后,我们的程序中就增加了一个内置对象jQuery,这是jQuery的核心对象,同时jQuery对象还可以使用美元符号$进行替
在引入后<script>标签内编写jQuery代码

文档就绪函数

文档就绪函数是jQuery中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。

简单地说，这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法，可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数，而99.99%的JavaScript函数都需要在那一刻执行。

文档就绪函数的使用方法

文档就绪函数的使用方法是:

完整方式: $(document).ready(fn) 或者jQuery(document).ready(fn)
简写方式: $(fn)

其中参数fn是指一个函数,代表了页面DOM元素加载完成后要执行的代码.

请确保在 <body> 元素的onload事件中没有注册函数，否则不会触发$(document).ready()事件。

可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）先后顺序依次执行。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <!-- 利用style完成对页面元素的美化工作 -->
        <style>
            a{
                border: 1px solid red;
                font-size: 28px;
            }

        </style>

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

        <!-- script块中存放了javascript代码 -->
        <script>
            //jquery内置对象jQuery
            //文档就绪函数,用于在页面加载成功后执行指定的代码
            //通常该函数用于替换window.onload事件,文档就绪函数的执行效率更高
            jQuery(document).ready(function(){
                //增加我们想要执行的代码
                alert("页面加载完成");
            });

            //jQuery(fn)是文档就绪函数的简写形式
            jQuery(function(){
                alert("页面加载完成1");
            })

            //jQuery这个内置对象拥有一个别名,即美元$符号
            //$=jQuery
            //简写后的格式是$(fn)
            $(function(){
                alert("页面加载完成2");
            })
        </script>
    </head>
    <!-- HTML的结构部分 -->
    <body>
        <a href="#" >有种点我啊1</a>
        <a href="#" >有种点我啊2</a>
        <a href="#" >有种点我啊3</a>
        <a href="#" >有种点我啊4</a>
        <a href="#" >有种点我啊5</a>
        <a href="#" >有种点我啊6</a>
    </body>
</html>

Yeoman92

关注

2
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
jQuery——基本语法与文档就绪函数

利用jQuery可以将结构(Html)、美化(Css)与交互(JavaScript)的部分有效的分离，从而让页面得到良好的可读性。利用jQuery开发程序的步骤如下:将jquery-1.11.3.js 复制到工程的js目录下在当前页面利用标签引入jquery-1.11.3.js 在引入该js后,我们的程序中就增加了一个内置对象jQuery,这是jQuery的核心对象,同时jQuery
复制链接

扫一扫