InnerHTML - 自调用函数有效，但为什么 Jquery 文档就绪不起作用？

Question

我正在测试在没有任何事件处理程序的情况下用 innerHTML 编写一些东西。我想知道为什么 Jquery document ready 不起作用 - 我认为它应该是一个自调用函数？常规自调用函数确实有效。

如果我在 HTML 中有这个

<div id="content">
  <p><span id="html_span1"></span></p>
  <p><span id="html_span2"></span></p>
</div>    

在 JS 中，常规的自调用函数起作用:

(function(){
     document.getElementById('html_span1').innerHTML = "self invoking function works";
}());    

但不是 Jquery 就绪函数:

$(document).ready(function() {
    document.getElementById('html_span2').innerHTML = "Is this displayed?";
});    

如果我将 Jquery 函数放在顶部，那么其他函数将停止工作 - 为什么会这样？还有，以 }()); 结尾的自唤起函数。 - 额外的括号非常重要，否则它不起作用。我不明白那个括号的意思？

Answer 1

如果您正在使用 Jquery，最好使用选择器:

$( document ).ready(function() {
// Handler for .ready() called.
    $("#html_span2").html("Is this displayed?");
});

看到它运行并使用它: http://jsfiddle.net/c66t0tb2/