DOM 加载函数学习笔记
什么是DOM?
DOM，全称 Document Object Model(文档对象模型)，是 HTML 和 XML 文档的编程接口。通过 DOM，开发者可以使用 JavaScript 对 HTML 和 XML 文档进行访问和操作。
什么是DOM 加载函数？
DOM 加载函数是用来在页面加载完成后执行一些操作的 JavaScript 函数。当页面中的所有元素都加载完成之后，浏览器会触发 DOMContentLoaded 事件，此时就可以执行 DOM 加载函数了。
DOM 加载函数的实例
1. 在页面加载完成后执行一个函数
htmlCopy Code<!DOCTYPE html>
<html>
<head>
<title>DOM 加载函数示例</title>
<script>
function init() {
alert('页面加载完成！');
}
document.addEventListener('DOMContentLoaded', init, false);
</script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
在这个示例中，我们定义了一个 init() 函数来弹出一个提示框，然后在页面加载完成后，通过 document.addEventListener('DOMContentLoaded', init, false) 将这个函数绑定到 DOMContentLoaded 事件上，从而当页面加载完成后执行这个函数。
2. 通过 jQuery 实现 DOM 加载函数
htmlCopy Code<!DOCTYPE html>
<html>
<head>
<title>DOM 加载函数示例</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(function() {
alert('页面加载完成！');
});
</script>
</head>
<body>
<h1>Hello World!</h1>
</body>
</html>
在这个示例中，我们通过引入 jQuery 库来简化 DOM 加载函数的实现。在 $(function() {...}) 中编写需要在页面加载完成后执行的操作即可。
结语
DOM 加载函数是用来在页面加载完成后执行一些操作的 JavaScript 函数。通过这篇学习笔记，我们了解了 DOM 加载函数的定义和实现方法，并且给出了两个实际运用的示例。