页面加载后Jquery addClass

我想知道，为什么jQuery代码在页面渲染后执行addClass函数。

我有一些元素（ h1 ）定位绝对。这个元素有规则：

 left: 60%; 

简单的JS：

 $(document).ready(function() { $('#test').find('header').find('h1').addClass('move'); }) 

CSS：

 .move { left: 40% } 

现在，问题：为什么在页面加载时， h1元素首先在60％左右，但是第二次加载后，由于move类，它向左移动了40％。 此效果看起来很糟糕，因为h1元素现在已替换页面上可见的效果…

我希望这个元素在左边40％，所以用户看不到“移动效果”。

此致，马雷克。

Answer 1

$(document).ready() ; 它是在呈现页面后执行的。 如果您不希望用户看到更改，则需要在CSS中设置样式或仅在JS中设置Class后显示该元素。

Answer 2

这个addClass函数在页面渲染后调用，因为你已经在document.ready（）中编写了它。 而是将它写在开放的脚本块中，以便在html之后加载它。

Answer 3

加载DOM（文档对象模型）时发生就绪事件。

因为此事件发生在文档准备好之后 ，所以它是拥有所有其他jQuery事件和函数的好地方。

ready（）方法指定ready事件发生时会发生什么。

所以你必须设置样式css

Answer 4

使用$(document).load(function() { // your code }); 而不是文件就绪function。