HTML id 属性
实例
通过 JavaScript 利用 id 属性来处理一段文本:
<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">更改文字</button>
<script>
function displayResult()
{
document.getElementById("myHeader").innerHTML = "祝你今天过得愉快!";
}
</script>
</body>
</html>
亲自试一试 »
下面有更多实例。
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚(link anchor),通过 JavaScript(HTML DOM)或通过 CSS 为带有指定 id 的元素改变或添加样式。
浏览器支持
属性 | |||||
---|---|---|---|---|---|
id | Yes | Yes | Yes | Yes | Yes |
语法
<element id="id">
属性值
值 | 描述 |
---|---|
id |
规定元素的唯一 id。 命名规则:
|
更多实例
实例 1
使用 id 属性链接到页面中具有指定 id 的元素:
<html>
<body>
<h2><a id="top">Some heading</a></h2>
<p>Lots of text....</p>
<p>Lots of text....</p>
<p>Lots of text....</p>
<a href="#top">Go to top</a>
</body>
</html>
亲自试一试 »
实例 2
在 CSS 中使用 id 属性:
<html>
<head>
<style>
#myHeader {
color: red;
text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">W3Schools is the best!</h1>
</body>
</html>
亲自试一试 »
相关页面
HTML 教程: HTML id
HTML 教程: HTML 属性
CSS 教程: CSS 语法
CSS 参考手册: CSS #id Selector
HTML DOM 参考手册: HTML DOM getElementById() 方法
HTML DOM 参考手册: HTML DOM id 属性
HTML DOM 参考手册: HTML DOM Style 对象