前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >jQuery的用法

jQuery的用法

原创
作者头像
落雨
发布2022-03-01 11:31:02
29.1K0
发布2022-03-01 11:31:02
举报
文章被收录于专栏:落雨的专栏落雨的专栏

1. jQuery的引入

代码语言:javascript
复制
<script src="js/jquery-1.12.4.min.js"></script>

2. jQuery的入口函数

我们知道使用js获取标签元素,需要页面加载完成以后再获取,我们通过给onload事件属性设置了一个函数来获取标签元素,而jquery提供了ready函数来解决这个问题,保证获取标签元素没有问题,它的速度比原生的 window.onload 更快

入口函数示例代码:

代码语言:javascript
复制
<script src="js/jquery-1.12.4.min.js"></script>
<script>
    window.onload = function(){
        var oDiv = document.getElementById('div01');
        alert('原生就是获取的div:' + oDiv);
    };
    $(document).ready(function(){
        var $div = $('#div01');
        alert('jquery获取的div:' + $div);
    });
</script>

<div id="div01">这是一个div</div>

入口函数的简写示例代码:

代码语言:javascript
复制
<script src="js/jquery-1.12.4.min.js"></script>
<script>
    window.onload = function(){
        var oDiv = document.getElementById('div01');
        alert('原生就是获取的div:' + oDiv);
    };

    /*
    $(document).ready(function(){
        var $div = $('#div01');
        alert('jquery获取的div:' + $div);
    });
    */

    // 上面ready的写法可以简写成下面的形式:
    $(function(){
        var $div = $('#div01');
        alert('jquery获取的div:' + $div);
    }); 
</script>

<div id="div01">这是一个div</div>

3. 小结

  • 引入jQuery
  • 获取标签元素需要在入口函数来完成,它的速度比原生的 window.onload 更快
  • jQuery入口函数有两种写法:
代码语言:javascript
复制
  // 完整写法
  $(document).ready(function(){
       ...
  });

  // 简化写法
  $(function(){
       ...
  });

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. jQuery的引入
  • 2. jQuery的入口函数
    • 入口函数示例代码:
      • 入口函数的简写示例代码:
      • 3. 小结
      领券
      问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档