使用jQuery的$(document).ready()函数是在DOM加载完成后执行的，它被广泛用于确保页面上的JavaScript代码在DOM完全加载后再执行。然而，有时候我们可能会遇到$(document).ready()函数被触发两次的情况。那么，为什么会发生这种情况呢？本文将探讨这个问题，并提供解决方案。
在某些情况下，$(document).ready()函数可能会被触发两次。这通常是由于页面上存在多个框架或iframe引起的。当页面中包含多个框架时，每个框架都会有自己的DOM，因此每个框架都会触发一次$(document).ready()事件。为了演示这个问题，我们来看一个简单的例子。假设我们有一个包含两个框架的页面，每个框架都加载了jQuery库，并且在其自己的$(document).ready()函数中打印一条消息到控制台。htmlframe1.html：jQuery $(document).ready()触发两次的问题
htmlframe2.html：Frame 1 Frame 1
html当我们运行这个例子时，我们会看到控制台输出了两次消息，分别来自frame1.html和frame2.html。这说明$(document).ready()函数被触发了两次，一次来自每个框架。为了解决这个问题，我们可以使用jQuery的.ready()函数来替代$(document).ready()。.ready()函数在jQuery 3.0版本中引入，它只会在当前框架的DOM加载完成后触发一次。我们可以将上面的例子稍作修改，使用.ready()函数来测试。Frame 2 Frame 2
htmlframe1.html和frame2.html保持不变。当我们运行这个例子时，我们会看到控制台输出了三次消息，分别来自页面和两个框架。这说明.ready()函数只在当前框架的DOM加载完成后触发了一次。解决方案：使用.ready()函数来替代$(document).ready()，以确保只在当前框架的DOM加载完成后执行代码。在上述例子中，我们展示了如何解决$(document).ready()被触发两次的问题。通过使用.ready()函数，我们可以确保代码只在当前框架的DOM加载完成后执行一次。这样可以避免重复执行代码的问题，提高代码的性能和可靠性。$(document).ready()被触发两次的问题通常是由于页面中存在多个框架或iframe引起的。为了解决这个问题，我们可以使用.ready()函数来替代$(document).ready()，以确保代码只在当前框架的DOM加载完成后执行一次。希望本文对你理解和解决$(document).ready()被触发两次的问题有所帮助！jQuery .ready()替代$(document).ready()