JavaScript用在哪里

<script> 标签

在HTML，JavaScript代码必须插入<script> 和 </script>之间的.

document.getElementById("demo").innerHTML = "Hello JavaScript";

让我试试

旧的JavaScript实例可能使用类型属性: <script type="text/javascript">. 类型属性不是必须的。在HTML中JavaScript是默认的脚本语言。

JavaScript函数和事件

一个JavaScript函数是一个JavaScript代码块，当"调用"时可以执行。

例如，当事件发生时，可以调用一个函数，如用户单击按钮时。

在以后的章节中你将学到更多关于函数和事件的知识。

JavaScript 在<head>和<body>里面

可以在HTML文档中放任何数量的脚本.

脚本可以放在<body>里面，或放在一个HTML页面的<head>部分，或者二者都可以。

JavaScript 在<head>里面

在这里实例里面，JavaScript函数放在页面的<head>部分。

单击按钮时调用（called）该函数:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>编程字典</title>
  <script>
    function myFunction() {
        document.getElementById("demo").innerHTML = "段落被改变.";
    }
  </script>
</head>

<body>

  <h1>JavaScript在Head里面</h1>

  <p id="demo">一个段落.</p>

  <button type="button" onclick="myFunction()">试试</button>

</body>
</html>

让我试试

JavaScript 在<body>里面

在这个实例中，JavaScript函数放在页面的<body>部分

单击按钮时调用（called）该函数:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>编程字典</title>
</head>
<body>

  <h1>JavaScript 在Body里面</h1>

  <p id="demo">一个段落.</p>

  <button type="button" onclick="myFunction()">试试</button>

  <script>
    function myFunction() {
        document.getElementById("demo").innerHTML = "段落被改变.";
    }
  </script>

</body>
</html>

让我试试

将脚本放置在<body>元素的底部会提高显示速度，因为脚本编译会减慢显示速度。

外部 JavaScript

脚本也可以放在外部文件中：

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

当许多不同的网页使用相同的代码时，外部脚本是实用的.

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

使用外部脚本，在<script>标签的src属性中指定：

<!DOCTYPE html>
<html>
<body>

<script src="myScript.js"></script>

</body>
</html>

让我试试

You can place an external script reference in or as you like.

可以在<head> 或者 <body>中放置外部脚本引用。

脚本将表现得好像它恰好位于<script>标记所在的位置。

外部脚本不能包含<script>标签.

外部JavaScript的优势

在外部文件中放置脚本有一些好处:

  • 它将HTML和代码代码分开
  • 它使HTML和JavaScript更容易阅读和维护
  • 缓存JavaScript，可以加速页面加载JavaScript文件

要将多个脚本文件添加到一个页面中 - 使用多个脚本标签：

<script src="myScript1.js"></script>
<script src="myScript2.js"></script>

外部引用

外部脚本可以引用完整的URL或与当前网页相对应的路径。

此示例使用完整的URL链接到脚本:

<script src="http://www.codingdict.com/js/myScript1.js"></script>

让我试试

此示例使用位于当前网站上指定文件夹中的脚本:

<script src="/js/myScript1.js"></script>

让我试试

此示例链接到位于当前页相同文件夹中的脚本:

<script src="myScript1.js"></script>

让我试试