3

嘿，我只是在为我的 JS 和 jQuery 实践编写另一个基本脚本，当我意识到这实际上是由什么组成时，我只是在抽出 goold ol' document-ready 事件，我想知道我是对的还是不是：

这是为 jQuery 准备的文档：

$(document).ready(function(){});

现在，美元符号是 jQuery 的简写，它调用 jQuery 库，所以我们可以进行 jQuery 语句和调用，对吗？

(document) 是一个选择器，它指的是 DOM 的“最高”部分（除了 Window？）。

.ready 是在 DOM 完全加载时发生的动作。现在，“DOM”已完全加载，在这种情况下，DOM 是否指的是正在选择的内容？因此，如果选择正文而不是文档，脚本会在加载之前执行吗？

(function(){});

这部分让我有点困惑。

我知道一旦我们的文档加载完毕，它就会运行我们的脚本。换句话说，它会运行我们的函数吗？我们的整个脚本是否被认为是一个函数？而且，它实际上只是一个大的 JavaScript 语句，对吗？因为它以分号结尾。另外，为什么我们的脚本通常放在大括号之间，而不是函数的括号？有什么不同？

非常感谢，对不起n00by问题，我只是好奇！xD

4

7 回答 7

15

哇，这是一个答案的一大堆问题:)

现在，美元符号是 jQuery 的简写，它调用 jQuery 库，所以我们可以进行 jQuery 语句和调用，对吗？

是的，$并且jQuery指的是同一个对象。取自 jQuery 的源代码：

// Expose jQuery to the global object
window.jQuery = window.$ = jQuery;

window是全局对象。添加到其中的任何内容都可以在全局范围内使用，因此您可以将其称为window.$，或者只是$举例。

(document) 是一个选择器，它指的是 DOM 的“最高”部分（除了 Window？）。

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

.ready 是在 DOM 完全加载时发生的动作。现在，“DOM”已完全加载，在这种情况下，DOM 是否指的是正在选择的内容？

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

因此，如果选择正文而不是文档，脚本会在加载之前执行吗？

目前 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;
},

因为它不关心传入的是什么选择器，所以你也可以通过它body，什么都没有，或者你想要的任何东西。

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

它仍然可以工作。

(function(){});

这部分让我有点困惑。

我知道一旦我们的文档加载完毕，它就会运行我们的脚本。换句话说，它会运行我们的函数吗？

是的，当 DOM 准备好时，这个和你绑定到 ready 事件的每个函数都会被执行。

我们的整个脚本是否被认为是一个函数？

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

<script>
    function hello() { alert("hello"); }
    hello();
</script>

而且，它实际上只是一个大的 JavaScript 语句，对吗？

并不真地。您可以根据需要将 JavaScript 模块化。例如，您可以拥有类似于类、对象、可重用小部件、诸如 MVC 之类的架构模式以及其他一堆东西。

因为它以分号结尾。

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

<script>
    alert("Hello"), alert("World")
</script>

这将起作用并按顺序提醒这两个单词，并且没有分号。

另外，为什么我们的脚本通常放在大括号之间，而不是函数的括号？有什么不同？

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

于 2010-07-29T16:01:50.670 回答
4

该.ready()功能仅在选择文档时触发。我不相信你可以打电话$(body).ready()

基本上，ready() 函数接受 1 个参数 - 一个函数。你可以很容易地打电话

$(document).ready(alert)

但是我们通常做的是定义一个匿名函数function(){}

你是对的，典型中的所有代码$(document).ready(function(){})只是一个大函数。

我们的脚本位于大括号之间，因为这是您定义函数的方式。

而不是这样做：

function myFunc()
{
  alert('We are in my function');
}
$(document).ready(myFunc)

我们去掉中间人，然后这样做：

$(document).ready(function()
{
  alert('We are in my function');
});
于 2010-07-29T15:41:42.793 回答
1
  1. (document)不是选择器。它是对“文档”对象的引用。
  2. .ready是对 jQuery 对象上可用函数的引用。这是简写.bind("ready", f)
  3. (function() { ... })是事件的处理程序。

将函数绑定为“就绪”处理程序在概念上与绑定“单击”处理程序没有区别。

于 2010-07-29T15:38:30.377 回答
1

现在，美元符号是 jQuery 的简写，它调用 jQuery 库，所以我们可以进行 jQuery 语句和调用，对吗？语句和调用，对吗？

是的

.ready 是在 DOM 完全加载时发生的动作。现在，“DOM”已完全加载，在这种情况下，DOM 是否指的是正在选择的内容？因此，如果选择正文而不是文档，脚本会在加载之前执行吗？在加载之前执行吗？

不可以。只有文档可以触发 ready 事件。

这是 dom 准备好时将执行的函数

$(document).ready(function(){alert('ready')})

你colud alos写道：

$(document).ready(mxFunction)
function mxFunction(){alert('ready')}
于 2010-07-29T15:38:45.757 回答
1

我不得不不同意@eskimoblood '只有文档才能触发就绪事件。没有文档就绪事件是不正确的，jQuery 和其他库引入了“就绪”来指示 DOM 已就绪，不一定已加载。

window.loaded 在所有图像帧和其他资源都已加载时触发，因此“就绪”将在“加载”之前触发。查看“DOMContentLoaded”，它将为您提供有关如何实现“就绪”类型事件的更多详细信息。

于 2010-07-29T15:48:49.893 回答
0

我对 JavaScript 和 jQuery 并没有真正的了解，但是语句输入{}和参数输入()。那么()传递给函数{}的是什么函数的作用是什么

于 2010-07-29T15:37:47.710 回答
0

在 jQuery 中，您可以向任何 jQuery 事件添加一个函数，以便在事件发生后运行。

在这种情况下，when the (document) is ready(), run the function(){} within it。

在某些情况下，您可以向函数添加参数。例如，在使用jQuery.ajax成功设置时，我可以使用参数来访问我从 ajax 请求返回的数据，并在函数本身中重用该参数。

$.ajax({
  url: "test.html",
  cache: false,
  success: function(html){
    $("#results").append(html);
  }
});
于 2010-07-29T15:38:03.913 回答