HTML 怎么设置script
时间: 2024-05-09 10:21:03 浏览: 122
Html页面文字属性设置
5星 · 资源好评率100%
在HTML中使用<script>标签来设置script,具体方法如下:
1. 写在HTML文件中
在HTML文件中,可以使用<script>标签来设置script。代码如下:
```
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<script>
// 在这里编写JavaScript代码
</script>
</body>
</html>
```
可以将JavaScript代码直接写在<script>标签中。
2. 外部文件引入
将JavaScript代码保存在外部文件中,然后使用<script>标签将其引入到HTML文件中。代码如下:
```
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
<script src="script.js"></script>
</head>
<body>
<!-- 在这里可以使用script.js中的变量和函数 -->
</body>
</html>
```
其中,`src`属性指定了外部JavaScript文件的路径。
注意:JavaScript文件的路径应该相对于HTML文件的路径。
3. 内部文件引入
在HTML文件中使用<script>标签引入其他部分的HTML文件或模板。代码如下:
```
<!DOCTYPE html>
<html>
<head>
<title>My Webpage</title>
</head>
<body>
<!-- 在这里引入其他部分的HTML文件或模板 -->
<script type="text/template" id="my-template">
<div class="my-div">
<p>这是一个模板</p>
</div>
</script>
<!-- 在这里使用模板 -->
<div id="my-container"></div>
<script>
var template = document.querySelector('#my-template');
var container = document.querySelector('#my-container');
container.innerHTML = template.innerHTML;
</script>
</body>
</html>
```
其中,`<script type="text/template">`定义了一个模板,`<script>`标签的`id`属性指定了模板的ID,`<div>`标签的`id`属性指定了用来展示模板的容器。
在JavaScript中,使用`document.querySelector()`方法获取模板和容器,然后将模板的内容赋值给容器的`innerHTML`属性即可。
阅读全文