Question

我很好奇为什么下面的代码会在页面上显示“为什么这个文字出现在加载中？”

<!DOCTYPE html>
<html lang="en">
<head>
<title>Hello title</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script>
<script>
$(function() {
    $('<h4>Why this text appears on load</h4>').click(function() {
        alert('3');
    }).insertAfter($('h1'));
});
</script>
</head>
<body>
    <h1>H</h1>
</body>
</html>

Answer 1

在jquery.js中，jQuery通过使用DOMContentLoaded事件或document.onreadystatechange事件来监听DOM的准备情况。 dom准备就绪后，所有已传递给.ready()的回调都会被触发，之后对.ready()的任何调用都会立即执行。

注意：$(function(){})相当于$(document).ready(function(){})

Answer 2

在document.ready()

上$('<h4>Why this text appears on load</h4>')后插入

insertAfter($('h1'));

$(function() {})是document.ready(function() {})的缩写形式，只要页面中的html元素可用，就会执行。

Answer 3

$(function(){})是$(document).ready(function(){})的简写。因此，当文档（DOM）准备就绪时，您的代码就会运行。

您创建了一个<h4>元素，为其指定了一个点击处理程序，然后在页面上的每个<h1>后附加它。

jQuery：为什么元素存在于文档准备好的页面上？

3 个答案: