最新的Web开发教程
 

JavaScript去哪儿


JavaScript可以被放置在<body><head> HTML页面的部分。


<script>标签

在HTML,JavaScript代码必须之间插入<script></script>标记。

<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>

较早的例子可以用一个类型的属性: <script type="text/javascript">
不需要这种类型的属性。 JavaScript是HTML中的默认脚本语言。


JavaScript函数和事件

一个JavaScript function是JavaScript代码块,可当“问道”执行。

例如,可以在事件发生时,当用户点击一个按钮等来执行的功能。

您将了解更多有关的职能和活动在后面的章节。


在JavaScript的<head><body>

您可以将任意数量的脚本的HTML文档英寸

脚本可以放置在<body>或者在<head> HTML页面的部分,或者在两者。

保持所有的代码在一个地方,始终是一个好习惯。


在JavaScript的<head>

在这个例子中,JavaScript函数被放置在<head> HTML页的一节。

该函数被调用(调用)一个按钮被点击时:

<!DOCTYPE html>
<html>

<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>

<body>

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

</body>
</html>

试一试»

在JavaScript的<body>

在这个例子中,JavaScript函数被放置在<body> HTML页的一节。

该函数被调用(调用)一个按钮被点击时:

<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>

</body>
</html>
试一试»

它在底部放置脚本是一个好主意<body>元素。
这可以提高页面加载,因为脚本编译可减慢显示。


外部JavaScript

脚本也可以被放置在外部文件:

myScript.js

function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}

当同一代码在许多不同的网页中使用外部脚本实用。

JavaScript文件的文件扩展名为.js

要使用外部脚本,把脚本文件的名称中的src(源)属性<script>标记:

<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html>
试一试»

您可以将在外部脚本引用<head><body>只要你喜欢。

该脚本的行为就好像它位于确切位置<script>标记的位置。

外部脚本不能包含<script>标记。


外部JavaScript优势

放置在外部文件中的JavaScript有一定的优势:

  • 它分离HTML和代码
  • 它使HTML和JavaScript更容易阅读和维护
  • 缓存的JavaScript文件可以加快页面加载