我们平时在页面上写JS 是放在头部<head>中呢 还是放到body 最下面 能更优化？

查了一番资料，推荐 放在页面底部如：

<html>

    <head>

        <title>My awesome page</title>

        <!-- CSS -->

        <link rel="stylesheet" type="text/css" href="...">

        <link rel="stylesheet" type="text/css" href="...">

        <link rel="stylesheet" type="text/css" href="...">

        <link rel="stylesheet" type="text/css" href="...">

    </head>

    <body>

        <!-- Content content content -->

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

        <script type="text/javascript" src="..."></script>

        <script type="text/javascript" src="..."></script>

        <script type="text/javascript" src="..."></script>

    </body>

</html>

WHY？

The problem caused by scripts is that they block parallel downloads. The HTTP/1.1 specification suggests that browsers download no more than two components in parallel per hostname. If you serve your images from multiple hostnames, you can get more than two downloads to occur in parallel. While a script is downloading, however, the browser won't start any other downloads, even on different hostnames. More...

CSS

A little bit off-topic, but... Put stylesheets at the top.

While researching performance at Yahoo!, we discovered that moving stylesheets to the document HEAD makes pages appear to be loading faster. This is because putting stylesheets in the HEAD allows the page to render progressively. More...

参考：

http://stackoverflow.com/questions/196702/where-to-place-javascript-in-a-html-file

https://developer.yahoo.com/performance/rules.html#js_bottom=

JS 脚本应该放在页面哪个位置 head body foot的更多相关文章

  1. 通过easyui tab添加的子页面JS脚本必须放在body才生效

    通过easyui tab添加的子页面JS脚本必须放在body才生效 可通过Chrome查看元素时,head标签是否含有你自己写的JS代码

  2. 不支持javascript的浏览器将JS脚本显示为页面内容

    不支持javascript的浏览器将JS脚本显示为页面内容.为了防止这种情况发生,您可以使用这样的HTML注释标记:<html ><体><script type=“tex ...

  3. js脚本语言在页面上不执行

    转换原理:// 编码原理就是创建TextNode节点,附加到容器中,再取容器的innerHTML.(将脚本编码) // 解码原理是将字符串赋給容器的innerHTML,再取innerText或text ...

  4. JS 实现点击页面任意位置隐藏div、span

    通过调用下面的 showhidden(“标签ID”) 显示div/span/…等标签内容,可以实现点击页面任意地方再次隐藏该标签内容,而showhidden(“标签ID”,”nohidden”)可保存 ...

  5. js脚本都可以放在哪些地方

    js脚本应该放在页面的什么地方 1.head部分 包含函数的脚本位于文档的 head 部分.这样我们就可以确保在调用函数前,脚本已经载入了. 2.body部分 执行位于 body 部分的脚本. 3.外 ...

  6. 无阻赛的脚本(js脚本延迟方法)

    js脚本的加载与执行 1.延迟脚本(defer属性) 带有defer属性的script标签,可以放置在文档的任何位置,在页面解析到该标签时,会开始下载该脚本,但是不会立即执行,直到dom加载完成(on ...

  7. CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器

    CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...

  8. 动态加载JS脚本的4种方法

    实现OPOA(One Page One Application)时,必须使用动态加载js. 也就是在用户选择某个菜单项后,再动态加载对应的全部js到客户端. 动态加载js的情况很多啊,比如解决ajax ...

  9. selenium webdriver学习（三）------------执行js脚本

    selenium webdriver学习(三)------------执行js脚本 博客分类: Selenium-webdriver   在用selenium 1.X的时候常常会用到getEval() ...

随机推荐

  1. CQRS架构

    CQRS架构 命令查询的责任分离Command Query Responsibility Segregation (简称CQRS)模式是一种架构体系模式,能够使改变模型的状态的命令和模型状态的查询实现 ...

  2. Android 获取截图 并将其保存到本地sd在卡路径

    /** * 获取当前屏幕和保存截图 */ private void GetandSaveCurrentImage() { //1.构建Bitmap WindowManager windowManage ...

  3. TortoiseGit for windows安装与配置

    1. 下载地址 TortoiseGit与Language Packs下载: https://code.google.com/p/tortoisegit/wiki/Download?tm=2 msysg ...

  4. Wookmark-jQuery-master 瀑布流插件

    Wookmark-jQuery-master 瀑布流插件使用介绍,含个人测试DEMO 要求 必备知识 本文要求基本了解 Html/CSS,  JavaScript/JQuery. 开发环境 Dream ...

  5. 由于检索用户的本地应用程序数据路径时出错，导致无法生成 SQL Server 的用户实例

    /”应用程序中的服务器错误. 由于检索用户的本地应用程序数据路径时出错,导致无法生成 SQL Server 的用户实例.请确保该用户在此计算机上有本地用户配置文件.该连接将关闭. 堆栈跟踪: [Sql ...

  6. KMP算法详解-- 转自Matrix67

       6 7 8 9 --    A = a b a b  6 7  7 8 9 --    A = a b a b a  5 6 7  8 9 --    A = a b a b a b  6 7 ...

  7. linux下的中文编码问题

    很多linux的初学者都会碰到这样一个问题:把windows下的文档拷到linux系统,会出现乱码!其实这涉及到中文编码的问题.linux系统默认的是统一码(utf8).而如果你的文件是big5,显然 ...

  8. 只有五行的Floyd最短路算法

            暑假,小哼准备去一些城市旅游.有些城市之间有公路,有些城市之间则没有,如下图.为了节省经费以及方便计划旅程,小哼希望在出发之前知道任意两个城市之前的最短路程.         上图中有 ...

  9. 用Python复习离散数学（一）

    最近要复习离散数学,不想挂啊,但是又想编程,大家知道啦,程序员离不开代码啊,所用想边复习边写代码,所以就自己用代码去实现一下离散的知识点,当做复习,自知自己的Python很渣,也想借此巩固一下基础,哈 ...

  10. git命令与github使用

    GitHub 是一个类似 SourceForge 的免费项目管理及分享的服务平台,要想使用 github,用户可以免费注册成为 github 注册用户,之后使用git命令进行操作使用.github 的 ...