jquery学习手记（1）

绝地灬酷狼 2022-04-22 15:34 243阅读 0赞

1.$ vs $()

*  $()方法中的参数是jQuery选择器并调用该选择器的方法，格式如下所示： `$.fn`,例子：$("h1").remove();自动接收和返回该选择器的动作。
 *  $ 方法通常是工具类方法,不和选择器一起使用; 它们不会自动传递任何参数, 并且它们的返回值是样式多样的

2.$( document ).ready() vs $( window ).load(function()\{ ... \})

`$( document ).ready()` 方法当页面的 DOM (Document Object Model) 加载完成时就可以执行。

`$( window ).load(function(){ ... })` 方法当整个页面（图片和子帧）都完全加载后，不只是DOM加载完成，才能运行。

示例代码如下：

1 // A $( document ).ready() block
    2 $( document ).ready(function() {
    3   console.log("ready!");
    4 });

或者更简洁的方法：

1 // Shorthand for $( document ).ready()
    2 $(function() {
    3   console.log("ready!");
    4 });

传递一个自定义的function到ready（）而不是匿名function.

1 // Passing a named function instead of an anonymous function
    2  
    3 function readyFn( jQuery ) {
    4   // code to run when the document is ready
    5 }
    6  
    7 $( document ).ready( readyFn );
    8 // OR
    9 $( window ).load( readyFn );

一个完整的实例如下：

1 <html>
     2   <head>
     3     <script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
     4     <script>
     5       $( document ).ready(function() {
     6         console.log("document loaded");
     7       });
     8  
     9       $( window ).load(function() {
    10         console.log("window loaded");
    11       });
    12     </script>
    13     </head>
    14     <body>
    15       <iframe src="http://techcrunch.com"></iframe>
    16     </body>
    17 </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，243人围观）

还没有评论，来说两句吧...

相关阅读

相关 jQuery学习笔记1——初识jQuery

1. 什么是jQuery ? jQuery 是一个兼容多浏览器的 javascript 框架。兼容CSS3。jQuery2.0及后续版本将不再支持IE6/7/8浏览器

超、凢脫俗/ 2022年08月26日 03:40/ 0 赞/ 241 阅读

相关 JQuery学习系列1

一、函数式循环1： $.map(arr,fun); 1、语法：$.map(数组或对象,回调函数); 目的将过程操作，转化为函数式操作 2、 <script>

朴灿烈づ我的快乐病毒、/ 2022年08月05日 07:37/ 0 赞/ 148 阅读

相关 jQuery学习总结1

一、下载集CDN引入 1.1、官方下载地址：[http://jQuery.com/download/][http_jQuery.com_download] jq自2.0

短命女/ 2022年06月05日 06:52/ 0 赞/ 225 阅读

相关 jquery学习手记（1）

1.$ vs $() $()方法中的参数是jQuery选择器并调用该选择器的方法，格式如下所示： `$.fn`,例子：$("h1").remove();自动接收和返回该

绝地灬酷狼/ 2022年04月22日 15:34/ 0 赞/ 244 阅读

相关 MVVM Light 学习笔记1 安装手记

首先，按照官网这里所说的进行安装 [http://www.galasoft.ch/mvvm/\install][http_www.galasoft.ch_mvvm_insta

落日映苍穹つ/ 2021年12月12日 05:13/ 0 赞/ 274 阅读

相关 Vue CLI 学习手记

简介 VueCLI其实就是vue为了方便开发，迅速搭建项目目录，基本配置，测试等创建的命令集。下面几个重要 Vue CLI全局安装比较好，因为我们需要他创建一个Vue项

淡淡的烟草味﹌/ 2021年10月19日 02:34/ 0 赞/ 340 阅读

相关 JAVA学习手记-HTTP&Response&servletContext

Response ![在这里插入图片描述][20191031194658816.png] QQ 1285575001 Wechat M010527 技术交流

ゞ浴缸里的玫瑰/ 2021年07月26日 01:04/ 0 赞/ 401 阅读

相关 JAVA学习手记-AJAX&Json

AJAX&json -------------------- ![在这里插入图片描述][20191031193737646.png] QQ 1285575001

谁借莪１个温暖的怀抱￠/ 2021年07月25日 19:23/ 0 赞/ 352 阅读

相关 JAVA学习手记-Servlet&HTTP&Request

Servlet&HTTP&Request QQ 1285575001 Wechat M010527 技术交流 QQ群599020441 纪年科技aming

﹏ヽ暗。殇╰゛Y/ 2021年07月25日 17:47/ 0 赞/ 397 阅读

相关 Python黑帽子——Pentesters手记（1）

![在这里插入图片描述][20191210072651187.png] -------------------- QQ 1285575001 Wechat M01052

快来打我*/ 2021年07月25日 14:19/ 0 赞/ 389 阅读