📅  最后修改于: 2023-12-03 14:39:04.241000             🧑  作者: Mango
JavaScript是一种用于网页交互的编程语言。通过在HTML文件中添加JavaScript代码,您可以为网页添加各种交互功能和动态效果。以下是如何在HTML中添加JavaScript的示例:
您可以使用<script>
标签在HTML文件中直接嵌入JavaScript代码。以下是一个简单的示例:
<!DOCTYPE html>
<html>
<head>
<title>添加JavaScript示例</title>
</head>
<body>
<h1>使用JavaScript改变文本内容</h1>
<p id="demo">这是一个段落。</p>
<script>
// 修改文本内容
document.getElementById("demo").innerHTML = "这是修改后的文本。";
</script>
</body>
</html>
在这个示例中,通过将JavaScript代码嵌入到<script>
标签中,我们可以使用document.getElementById()
函数选取具有指定id的元素,并使用innerHTML
属性修改其内容。
另一种添加JavaScript的方式是将代码存储在外部文件中,并通过src
属性链接到HTML文件中。以下是示例:
<!DOCTYPE html>
<html>
<head>
<title>添加JavaScript示例</title>
<script src="script.js"></script>
</head>
<body>
<h1>使用外部JavaScript文件改变文本内容</h1>
<p id="demo">这是一个段落。</p>
</body>
</html>
在这个示例中,我们将JavaScript代码保存在名为script.js
的外部文件中,并使用<script>
标签中的src
属性链接到HTML文件中。代码将在页面加载时执行。
通常,开发人员更倾向于将JavaScript代码放置在HTML文件的末尾,以允许页面的其他内容先加载。以下是示例:
<!DOCTYPE html>
<html>
<head>
<title>添加JavaScript示例</title>
</head>
<body>
<h1>在尾部加载JavaScript脚本</h1>
<p id="demo">这是一个段落。</p>
<script src="script.js"></script>
</body>
</html>
与外部文件方式类似,代码将在页面加载时执行,但在其他页面内容加载完成后。
以上是向HTML中添加JavaScript的三种常用方法。您可以根据需求选择其中之一,并开始为您的网页添加交互功能和动态效果。