San*_*fer 21 javascript jquery location head document-body
我一直在想,主要是因为在创建页面时我总是遇到麻烦,基于以下内容:
你什么时候写你的javascript
<head><body>$(document).ready()我可能是愚蠢的,但是由于错误的地方或是或否doc.ready()命令,我有几次没有执行我的JavaScript(/ jQuery).所以我真的很想知道.
jQuery和'var'命令也是如此
Kyl*_*yle 15
$(document).ready() 只需确保在加载javascript之前加载所有DOM元素.
什么时候无关紧要
无需等待此事件触发,您最终可能会操纵页面上尚未存在的DOM元素或样式.DOM ready事件还允许您更灵活地在页面的不同部分上运行脚本.例如:
<div id="map"></div>
<script type="text/javascript">document.getElementById('map').style.opacity = 0;</script>
将运行,因为在脚本运行之前已加载了映射div.实际上,通过将脚本放在页面底部,可以获得一些非常好的性能改进.
什么时候重要
但是,如果要在<head>元素中加载脚本,则大多数DOM都未加载.这个例子不起作用:
<script type="text/javascript">document.getElementById('map').style.opacity = 0;</script>
<div id="map"></div>
不会,因为地图div尚未加载.
安全的解决方案
您可以通过等待整个DOM加载来避免这种情况:
<script type="text/javascript">$(document).ready(function () {
document.getElementById('map').style.opacity = 0;
});
</script>
<div id="map"></div>
Poi*_*nty 12
通过现代"最佳实践",它是这样的:
<head>页面开始呈现之前应该发生的时间.例如HTML 5 shim库或Modernizr.<body>如果你可以在所有其他情况下逃脱脚本,将脚本放在最后.有时,您最终会在页面中依赖于需要在body元素末尾加载的内容.这是一种不受欢迎的情况,但是如果你无法避免它可以强制脚本被加载到<head>而不是在结束时<body>.
最好在文档末尾加载东西,因为浏览器会<script>在加载标记时评估标记的内容.(有一些"现代"的方法可以避免这种情况,但这种方法正在进入更加复杂的领域.)
何时使用"就绪"处理程序(或"加载"处理程序)的决定与关于将<script>标记放在何处的决定略有不同.如果你有一个来自服务器端模板系统的页面内小部件生成(不可取,但你能做什么？)jQuery引用,那么你需要在页面顶部导入jQuery,即使其他代码可以将初始化推迟到"就绪"处理程序.也就是说,关于何时使用"就绪"的决定与您的脚本是否愿意依赖于在正确的位置导入页面,或者是否希望确保正确的事情发生在哪里无关它的<script>标签被放置了.
这是一个何时需要执行代码的问题.
如果您要操作DOM树(例如移动元素/ show-hide等)并将代码放在文档的头部,那么当您的代码执行时,您的元素将不会存在,因此您的代码将无法工作.
在这种情况下,您可以将代码放在文档的头部,并在文档DOM准备就绪时调用它 $(document).ready()
将代码放在文档的末尾很少是必要的,有一次我能想到的是google plus +1按钮,这需要你在最后的+1按钮之后放置一个脚本,所以你只需将它粘贴到文档的末尾为了确定.
| 归档时间： |
|
| 查看次数： |
31220 次 |
| 最近记录： |