js如何引入在html文件

2024年4月15日 互联网

在HTML文件中，可以通过`标签引入外部的JavaScript文件。，，`html，，``

在HTML文件中引入JavaScript（JS）主要有两种方式：内联和外部。

js如何引入在html文件

内联方式

在内联方式中，我们将JavaScript代码直接写在HTML文件中的<script>标签之间，这种方式适用于小段的JavaScript代码。

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "Hello, World!";
</script>
</body>
</html>

外部方式

在外部方式中，我们将JavaScript代码写在一个单独的.js文件中，然后在HTML文件中通过<script>标签引用这个.js文件，这种方式适用于大段的JavaScript代码或者需要被多个HTML页面共享的JavaScript代码。

假设我们有一个名为script.js的文件，其内容如下：

document.getElementById("demo").innerHTML = "Hello, World!";

我们可以在HTML文件中这样引用它：

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script src="script.js"></script>
</body>
</html>

相关问题与解答

问题1：如何在JavaScript文件中使用<script>标签？

答：在JavaScript文件中，我们不使用<script>标签。<script>标签是用于HTML文件中的，用来包含JavaScript代码或者是引用外部的JavaScript文件，在JavaScript文件中，我们只写JavaScript代码，不需要任何HTML标签。

问题2：如果我想在页面加载完成后才运行JavaScript代码，应该怎么做？

答：你可以将你的<script>标签放在HTML文件的</body>标签之前，然后使用window.onload事件来确保你的代码只在页面加载完成后运行。

<!DOCTYPE html>
<html>
<body>
<p id="demo"></p>
<script src="script.js"></script>
<script>
window.onload = function() {
    document.getElementById("demo").innerHTML = "Hello, World!";
}
</script>
</body>
</html>

在这个例子中，"Hello, World!"只有在页面加载完成后才会被添加到<p>元素中。

最新文章