HTML 和 Javascript
提示
- JavaScript在HTML中的作用:JavaScript 用于增强 HTML 页面的交互性和动态特性,例如通过按钮点击触发弹出警告对话框。
- 添加JavaScript的两种方 式:一是在HTML文件中使用
<script>
标签直接编写内部脚本;二是通过<script>
标签的src
属性链接到外部的JavaScript文件。 <noscript>
标签的用途:用于向禁用 JavaScript 或浏览器不支持 JavaScript 的用户显示备用内容,确保网页的可访问性。
JavaScript,也称为 JS,是一种用于网页开发的编程语言。它用于使 HTML 页面更加互动和动态。例如,
<html>
<head>
<script>
function speak() {
alert("你好");
}
</script>
</head>
<body>
<button onclick="speak()">点击我</button>
</body>
</html>
浏览器输出(点击前)
浏览器输出(点击后)
在上述示例中,我们通过使按钮点击时触发警告对话框来为按钮添加功能。
如何添加 JavaScript
向 HTML 文件添加 JavaScript 有两种方式:
- 添加内部脚本
- 添加外部脚本
添加内部脚本
我们可以通过在 <script>
标签内编写 JavaScript,将其添加到 HTML 文档中。例如,
<head>
<title> </title>
<script>
function showHiddenText() {
document.getElementById("demo").innerHTML = "你好,世界";
}
</script>
</head>
<body>
<button onclick="showHiddenText()">点击我</button>
<p id="demo"></p>
</body>
浏览器输出(点击前)
**浏览器输出(点击后)
**
在上述示例中,点击按钮后显示 你好,世界
文本。
注意: 一般来说,script 标签放置在文档的 <head>
中,但放置标签的位置没有限制。
添加外部脚本
我们也可以在 HTML 文档中使用外部 JavaScript 文件。要添加外部脚本,我们需要在 <script>
标签的 src
属性中提供 JS 文件的位置。例如,
<script src="scripts/code.js"></script>
这里,我们在 HTML 文件中使用了 scripts 文件夹中的 code.js
文件。
当 JavaScript 代码较大时,这种方法很有帮助,因为它可以通过避免混乱来保持 HTML 文件的小巧。此外,HTML 文档也可以使用它。这同样有助于通过避免混乱保持 HTML 文件的小巧和语义化。
HTML <noscript>
标签
HTML 的 <noscript>
标签用于向禁用 JavaScript 或其浏览器不支持 JavaScript 的用户提供信息。例如,
<noscript>请启用 JavaScript 以查看此页面!</noscript>
如果浏览器无法运行 JavaScript,则 <noscript>
标签的内容才会显示。
浏览器输出