Question

我正在学习javascript并说实话，有些部分对我没有意义。像这个。我先写了这段代码：

<body>
<script type="text/javascript">
function people(name, age){
this.name = name;
this.age = age;
this.ret = yearsLeft;
}

function yearsLeft(){
var numYears = 65 - this.age;
return numYears;
}         

var sam = new people("sam forest", 39);
var billy = new people("billy wood", 45);

document.write(billy.ret());
</script>
</body>

我得到了结果。但是我在第一个之后写了这个，我得到了相同的结果：

<head>
 <title>Javascript</title>

 <script type="text/javascript">
 function people(name, age){
 this.name = name;
 this.age = age;
 this.ret = yearsLeft;
 }

 function yearsLeft(){
 var numYears = 65 - this.age;
 return numYears;
 }        

 var sam = new people("sam forest", 39);
 var billy = new people("billy wood", 45);
 </script>
 </head>
 <body>
 <script type="text/javascript">

 document.write(billy.ret());
 </script>
 </body>

这是我的问题，当我在两种方式得到相同的结果时，有什么区别？

Answer 1

来自雅虎的Best Practices for Speeding Up Your Web Site：

脚本引起的问题是它们会阻止并行下载。   HTTP / 1.1规范表明浏览器不再下载   每个主机名并行两个组件。如果您提供图像   从多个主机名，您可以获得两次以上的下载   在平行下。但是，在下载脚本时，浏览器不会   即使在不同的主机名上，也可以启动任何其他下载。

在某些情况下，将脚本移到底部并不容易。如果，   例如，该脚本使用document.write插入部分内容   页面的内容，不能在页面中向下移动。也可能   是一个范围问题。在许多情况下，有办法解决这些问题   的情况。

经常出现的替代建议是使用延迟   脚本。 DEFER属性表示脚本没有   包含document.write，是他们可以使用的浏览器的线索   继续渲染。不幸的是，Firefox不支持DEFER   属性。在Internet Explorer中，脚本可能会延迟，但不会延迟   尽可能多。如果可以延迟脚本，也可以移动它   到页面底部。这将使您的网页加载速度更快。

因此，一般来说，最好将它们置于底部。然而，它并不总是可能的，而且无论如何它通常都没有那么大的差别。

Answer 2

在许多情况下，结果是相同的，但由于网络浏览器呈现html页面的方式存在相关差异。

由于浏览器从上到下读取页面内容，因此将javascript代码放在<head>标记内将导致在浏览器完成解析脚本后显示实际页面内容。将它放在</body>标记之前，可以让浏览器更快地显示内容，这通常是可取的。

自上而下呈现的另一个含义与SEO优化有关：因为大多数抓取工具会在页面顶部检查固定数量的字节，所以第一个字节填充了javascript代码会阻止抓取工具访问实际的页面内容，因此降低了你所拥有的任何SEO的好处。

Answer 3

因为你做的几乎是同样的事情。浏览器将按顺序评估您的javascript代码，如果它只是语句，那么它们将会被执行。

因此，您需要注意的一件事是浏览器将评估您的漏洞文档（html，css，javascript），并且将立即执行非函数定义的javascript语句。

javascript，HTML，在头部和身体中编写javascript之间的区别

3 个答案: