为什么功能不起作用效果基本show jQuery的

-1

<!DOCTYPE HTML> 
<html> 
<head> 
<script src="jquery-2.0.3.js"></script> 
<script> 
    $("div.a").click(function(){ 
     $(this).slideUp(); 
     }); 
</script> 
</head> 
<body> 
<div class="a"> <p> aaa</p></div> 
</body> 
</html>

为什么不起作用？该函数与jquery文档中的相同。

来源

2016-04-17 Irina Farcau

@Juhana：我已经将该链接添加到了我的标准紧密链接库，谢谢。 –

脚本标记中的代码在浏览器解析脚本标记后立即运行，然后解析器继续执行HTML的其余部分（您使用defer或async属性）。所以你的代码挂钩事件处理程序运行之前该元素存在，所以没有什么可以连接。

移动script到HTML的年底，刚刚闭幕</body>标记之前：

<!DOCTYPE HTML> 
<html> 
<head> 
</head> 
<body> 
<div class="a"> <p> aaa</p></div> 
<!-- ...rest of page here... --> 
<script src="jquery-2.0.3.js"></script> 
<script> 
    $("div.a").click(function(){ 
     $(this).slideUp(); 
    }); 
</script> 
</body> 
</html>

这样一来，由HTML定义的元素为脚本运行时的存在。更多这里：YUI Best Practices for Speeding Up your Website

如果由于某种原因，你不能控制脚本去哪里，第二好的选择是使用jQuery的ready回调。

来源

2016-04-17 09:59:27

为什么现成的方法是次佳？ – bugwheels94

它的工作原理，谢谢，但我不明白。那么为什么CSS属性在div html上工作，如果css是在html之前定义的。 –

@ user1533609：因为在页面中提早放置脚本是一种反模式。如果剧本结束，'ready'就不必要了。 –

为什么功能不起作用效果基本show jQuery的

回答

相关问题