了解文档就绪事件

Qco*_*com 3 javascript jquery domready

嘿,我刚刚为我的JS和jQuery练习编写了另一个基本脚本,当我意识到这实际上包含了什么时,我只是抽出了goold ol'文档就绪事件,我想知道我是对的还是不:

这是准备好jQuery的文档:

$(document).ready(function(){});
Run Code Online (Sandbox Code Playgroud)

现在,美元符号是jQuery的简写,它调用jQuery库,所以我们可以创建jQuery语句和调用,对吗?

(文档)是一个选择器,它指的是DOM的"最高"部分(除了Window?).

.ready是DOM完全加载时发生的操作.现在,"DOM"被完全加载,在这种情况下DOM是否指的是被选中的内容?因此,如果选择了body而不是document,脚本会在加载之前执行吗?

(function(){});
Run Code Online (Sandbox Code Playgroud)

这部分让我有点困惑.

我知道一旦我们的文档加载了,它就会运行我们的脚本.换句话说,它会运行我们的功能吗?我们的整个脚本是否被视为一种功能?而且,它只是一个很大的JavaScript声明,对吗?因为它以分号结尾.另外,为什么我们的脚本通常介于大括号之间,而不是函数的括号?有什么不同?

非常感谢,抱歉n00by的问题,我只是好奇!的xD

Anu*_*rag 15

哇,这是一个问题的答案:)

现在,美元符号是jQuery的简写,它调用jQuery库,所以我们可以创建jQuery语句和调用,对吗?

是的,$jQuery引用相同的对象.取自jQuery的来源:

// Expose jQuery to the global object
window.jQuery = window.$ = jQuery;
Run Code Online (Sandbox Code Playgroud)

window是全球对象.添加到其中的任何内容都可以在全球范围内使用,因此您可以将其称为window.$或者仅$作为示例.

(文档)是一个选择器,它指的是DOM的"最高"部分(除了Window?).

document不是选择器,而是指向DOM中最顶层节点的DOM对象.它有其他属性,如document.domain等.它的一个孩子是<html>元素.

.ready是DOM完全加载时发生的操作.现在,"DOM"被完全加载,在这种情况下DOM是否指的是被选中的内容?

是的,DOM指的是我们通常在jQuery选择器中选择的项目.更具体地说,它是页面的内存中表示.ready为不同的浏览器使用一堆事件来确定DOM何时加载.

因此,如果选择了body而不是document,脚本会在加载之前执行吗?

目前,jQuery的源代码并不关心在调用时传入的选择器ready.这是准备好的功能:

ready: function( fn ) {
    // Attach the listeners
    jQuery.bindReady(); 

    // If the DOM is already ready
    if ( jQuery.isReady ) {
        // Execute the function immediately
        fn.call( document, jQuery );

    // Otherwise, remember the function for later
    } else if ( readyList ) {
        // Add the function to the wait list
        readyList.push( fn );
    }

    return this;
},
Run Code Online (Sandbox Code Playgroud)

因为它不关心传递什么选择器,所以你也可以传递它body,什么都没有,或任何你想要的东西.

$({
    an: 'object', 
    that: 'has', 
    nothing: 'to', 
    'do': 'with', 
    ready: 'event'
}).ready(function() { .. });
Run Code Online (Sandbox Code Playgroud)

它仍然有效.

(function(){});

这部分让我有点困惑.

我知道一旦我们的文档加载了,它就会运行我们的脚本.换句话说,它会运行我们的功能吗?

是的,这个以及与ready事件绑定的每个函数都将在DOM准备就绪时执行.

我们的整个脚本是否被视为一种功能?

不,不是整个脚本.只有依赖于DOM的项目.有些东西需要在找到时进行处理.想想jQuery库本身.在处理之前,它不会等待任何DOM就绪事件.如果您编写JavaScript语句,它将按照找到的顺序进行处理,除非它是一个回传函数,就像您传递给的那样ready(..).因此,无论是否加载DOM,下面的代码都会立即执行并发出警告"hello".

<script>
    function hello() { alert("hello"); }
    hello();
</script>
Run Code Online (Sandbox Code Playgroud)

而且,它只是一个很大的JavaScript声明,对吗?

并不是的.您可以根据需要巧妙地模块化JavaScript.例如,你可以拥有类似于类,对象,可重用小部件,诸如MVC之类的架构模式之类的东西.

因为它以分号结尾.

分号与执行某事时无关.我写得很好.

<script>
    alert("Hello"), alert("World")
</script>
Run Code Online (Sandbox Code Playgroud)

这将按顺序工作并提醒两个单词,并且没有分号.

另外,为什么我们的脚本通常介于大括号之间,而不是函数的括号?有什么不同?

这是一个函数在JavaScript和其他几种语言中的定义方式.提高你的基本技能,以便更好地理解.不要将它称为脚本,因为它只会使问题混淆.它只是一个函数,里面有一些语句.