Script type 属性

在网页开发中，我们经常会使用 <script> 标签来引入 JavaScript 文件或代码块。<script> 标签的 type 属性用于指定脚本的 MIME 类型。在 HTML4 中，type 属性是必需的，但是在 HTML5 中，它变得可选了。然而，指定正确的 type 属性仍然是一个良好的实践，可以确保浏览器正确解析脚本。

基本语法

type 属性的基本语法如下：

<script type="text/javascript">
    // JavaScript 代码
</script>

在 HTML5 中，我们可以简化为：

<script>
    // JavaScript 代码
</script>

这样，浏览器会默认将脚本类型解释为 JavaScript。

常用的 MIME 类型

以下是一些常用的 MIME 类型，我们可以在 type 属性中使用：

• text/javascript：JavaScript 代码
• text/css：CSS 代码
• application/json：JSON 数据
• text/html：HTML 代码
• application/xml：XML 数据

示例代码

引入外部 JavaScript 文件

<script type="text/javascript" src="external.js"></script>

嵌入 JavaScript 代码块

<script type="text/javascript">
    console.log("Hello, world!");
</script>

引入外部 CSS 文件

<script type="text/css" src="styles.css"></script>

嵌入 CSS 代码块

<script type="text/css">
    body {
        background-color: #f0f0f0;
    }
</script>

引入 JSON 数据

<script type="application/json">
    {
        "name": "John Doe",
        "age": 30
    }
</script>

注意事项

• 在 HTML5 中，type 属性变得可选，但是为了向后兼容和更好的可读性，我们仍然建议指定正确的 type 属性。
• 如果不指定 type 属性，浏览器会默认将脚本类型解释为 JavaScript，但是最好还是明确指定。
• 如果 type 属性的值不是一个有效的 MIME 类型，浏览器可能会忽略脚本或抛出错误。

通过正确使用 type 属性，我们可以确保浏览器正确解析我们的脚本，从而提高网页性能和用户体验。