`

JS代码放在head和body的区别

 
阅读更多
    由于在页面中总是难免javascript脚本语言,在代码中看到body里可以放<script type=”text/javascript”>脚本,而head里也可用<scripttype=”text/javascript”>脚本,想要用好他们,就得了解他们的区别,经过自己的总结发现他们的区别如下:
一、在head主体里写,如果有方法体,那么就是在客户点击的时候触发,如果没写方法体,比如引入的js文件,那么在加载页面前就预加载了。
二、写在body主体里,是为了实现某些部分动态地创建文档。 这里比如制作鼠标跟随事件,肯定只有当页面加载后再进行对鼠标坐标的计算。或者是filter滤镜与javascript的联合使用产生的图片淡入淡出效果等。这个是在页面加载的时候加载。
二、会与body和head标签顺序有关。比如下面代码:
<html>
<body>
<script type="text/javascript">
alert("in body");
</script>
</body>
<head>
<script type="text/javascript">
alert("in head");
</script>
</head>
</html>

结果是先弹出body,再弹出head.
如果改下代码结果就截然相反了,例
<html>
<head>
<script type="text/javascript">
alert("in head");
</script>
</head>
<body>
<script type="text/javascript">
alert("in body");
</script>
</body>
</html>
执行时得考虑javascript执行顺序
分享到:
评论
1 楼 fuaotech 2015-07-17  
恩 相互借鉴!

相关推荐

    JS代码放在head和body中的区别分析

    总结一下,JavaScript代码放在`&lt;head&gt;`和`&lt;body&gt;`中的主要区别在于执行时机: 1. 放在`&lt;head&gt;`:代码会尽早执行,但可能在某些依赖的HTML元素解析之前,这可能导致错误,除非代码是与用户交互事件关联的函数。 2. ...

    javascript代码应当放在html代码哪个位置比较好_.docx

    根据项目的需求和个人偏好,可以选择将JavaScript代码放在`&lt;head&gt;`或`&lt;body&gt;`标签内,也可以使用外部文件进行管理。无论采取哪种策略,都应该考虑到代码的执行顺序、页面加载效率以及维护便捷性等因素。

    js放到head中失效的原因与解决方法

    在探讨将JavaScript代码放在HTML文档的&lt;head&gt;区域会导致失效的原因时,我们首先需要理解HTML页面的加载和渲染过程。在标准的HTML结构中,浏览器是从上到下逐行解析HTML文档的。如果在&lt;head&gt;部分就加载了JavaScript...

    html5.js文件,在head部分引用该文件,使各种浏览器支持html5

    HTML5.js库的工作原理就是检测浏览器对HTML5新特性的支持程度,并通过JavaScript代码来填充不支持的功能,使得这些旧浏览器也能尽可能接近地模拟HTML5的行为。 例如,对于不支持HTML5音频和视频标签的浏览器,...

    javascript写在head标签中产生的报错.pdf

    在HTML文档中,JavaScript代码可以放在`&lt;script&gt;`标签内,这两个标签可以放置在`&lt;head&gt;`或`&lt;body&gt;`标签内。然而,当JavaScript位于`&lt;head&gt;`标签中时,需要注意一些潜在的问题,正如“javascript写在head标签中产生的...

    head_head_js_源码

    在HTML中,`&lt;script&gt;`标签常被用于插入JavaScript代码,而放在&lt;head&gt;标签内的脚本通常会在文档解析时执行,这对于页面加载速度和资源管理有直接影响。 基于这些信息,我们可以深入探讨以下几个JavaScript在网页头部...

    百度站长平台返回顶部JS代码

    百度站长平台提供的返回顶部JS代码是一种实现这一功能的JavaScript代码片段。下面将详细解释这个功能的实现原理、应用场景以及如何使用和自定义。 1. 返回顶部功能实现原理: - JavaScript是实现这一功能的核心...

    引入JavaScript脚本代码到HTML文档中

    2. 内部脚本方式:这种方式将JavaScript代码放在`&lt;script&gt;`标签内,但不在HTML元素内部,而是放在HTML文档的`&lt;head&gt;`或`&lt;body&gt;`部分。这样代码更清晰,但仍然与HTML文档耦合。示例如下: ```html &lt;!DOCTYPE html&gt; ...

    ie中 body onload 和 window onload 解决法案

    在网页开发中,`body.onload` 和 `window.onload` 是两个常见的JavaScript事件处理函数,用于在页面完全加载后执行特定的代码。它们都是用来确保在执行任何操作之前,页面的所有资源(包括HTML、CSS、JavaScript、...

    JavaScript代码应该放在HTML代码哪个位置比较好?

    这种布局方式的优点在于,当整个HTML文档从上至下加载时,放置在&lt;head&gt;中的JavaScript代码会在文档的body部分加载之前被浏览器解析和执行。这就意味着在HTML文档的body部分加载任何元素之前,相关的JavaScript操作和...

    简单的js学习文件努力

    3. **外部.js 文件里**:当JavaScript代码量较大,或者需要在多个页面中复用时,最佳实践是将其放在外部.js文件中。这样可以提高代码的可维护性和复用性,只需要在HTML中引入一次,即可在所有引用该.js文件的页面中...

    右下角弹出的小窗口js代码

    例如,`main.js`可能包含了上述的JavaScript代码,`styles.css`用于设置弹窗及其元素的样式,而`index.html`则将两者引入并构建基本的HTML结构。在实际项目中,这些文件通常会放在不同的目录下,并通过`&lt;script&gt;`和`...

    JavaScript基础语法.pdf

    JavaScript代码可以放在HTML文件中任何位置, но我们一般放在网页的head或者body部分。 JavaScript基础语法包括语句和注释、标识符和关键字等。语句是JavaScript程序的执行单位,以分号结尾。多个语句可以写在一...

    javascript 和HTML的一些常用技巧

    1. 使用`&lt;SCRIPT&gt;`标记符:这是最直接的方式,将JavaScript代码放在`&lt;HEAD&gt;`或`&lt;BODY&gt;`标签内。例如,创建一个按钮,当用户点击时弹出对话框的代码如下: ```html &lt;HEAD&gt; &lt;TITLE&gt;JavaScript 示例 ...

    javascript

    通常建议将变量和函数定义放在head头部,而页面特效代码则放到body体后面。例如: ```html &lt;!DOCTYPE html&gt; &lt;head&gt; // 在head中的JavaScript代码 &lt;/head&gt; &lt;body&gt; &lt;!-- 页面内容 --&gt; // 在body末尾的...

    JavaScript程序开发之JS代码放置的位置

    正确的做法是将JavaScript代码放在HTML注释之外,确保script标签的正确解析和执行。 最后,针对外部JavaScript文件的引用,需要特别说明的是,引用外部JavaScript文件的script标签中,不应该包含和标签本身。这可能...

    javaScript-javascript-初级到高级-笔记.docx

    内部使用时,JavaScript代码可以直接写在HTML文件的`&lt;script&gt;`标签中,通常建议将定义的函数放在`&lt;head&gt;`部分,而调用函数的代码放在`&lt;body&gt;`部分,以确保在元素加载完成后执行。例如: ```html &lt;head&gt; &lt;title&gt;My ...

Global site tag (gtag.js) - Google Analytics