以下是一个简单的例子，演示如何使用 JavaScript 操作 <link> 元素：
<!DOCTYPE html>
<html>
<head>
<title>Link 对象示例</title>
<!-- 外部样式表链接 -->
<link rel="stylesheet" type="text/css" href="styles.css" id="styleLink">
<!-- JavaScript 代码 -->
<script>
function changeStylesheet() {
// 获取 Link 对象
var styleLink = document.getElementById("styleLink");
// 修改样式表的 href 属性
styleLink.href = "new-styles.css";
// 在控制台打印修改后的 href 值
console.log("修改后的样式表链接：" + styleLink.href);
}
</script>
</head>
<body>
<h1>这是一个示例页面</h1>
<p>点击按钮切换样式表：</p>
<!-- 切换样式表按钮 -->
<button onclick="changeStylesheet()">切换样式表</button>
</body>
</html>
在这个例子中，我们在页面的 <head> 部分引入了一个外部样式表。通过 JavaScript，我们获取了 <link> 元素的引用，并通过修改其 href 属性来更改样式表的链接。点击页面上的按钮将触发 changeStylesheet 函数，从而切换样式表。
除了修改 href 属性之外，还可以通过 JavaScript 操作 <link> 元素的其他属性，比如 type、media 等，以实现对外部资源的动态控制。
转载请注明出处：http://www.zyzy.cn/article/detail/4413/HTML