CSS 选择器参考手册
实例
选择属于其父元素的首个子元素的每个 <p> 元素，并为其设置样式：
p:first-child
{
background-color:yellow;
}
浏览器支持
| IE | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|
所有主流浏览器都支持 :first-child 选择器。
注释：对于 IE8 及更早版本的浏览器中的 :first-child，必须声明 <!DOCTYPE>。
定义和用法
:first-child 选择器用于选取属于其父元素的首个子元素的指定选择器。
亲自试一试 - 实例
例子 1
选择每个 <p> 中的每个 <i> 元素并设置其样式，其中的 <p> 元素是其父元素的第一个子元素：
p:first-child i
{
background:yellow;
}
例子 2
选择列表中的第一个 <li> 元素并设置其样式：
li:first-child
{
background:yellow;
}
例子 3
设置每个 <ul> 的首个子元素，并设置其样式：
ul>:first-child
{
background:yellow;
}
HTML DOM firstChild 属性
实例
返回文档的首个子节点：
document.firstChild;
定义和用法
firstChild 属性返回指定节点的首个子节点，以 Node 对象。
注释：在 HTML 中，文本本身是 HTML 元素的父节点，HEAD 和 BODY 是 HTML 元素的子节点。
浏览器支持
| IE | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|
所有主流浏览器都支持 firstChild 属性。
语法
node.firstChild
<!DOCTYPE html>
<html>
<body>
<p id="demo">请点击按钮来获得文档首个子节点的节点名。</p>
<button onclick="myFunction()">试一下</button>
<script>
function myFunction()
{
var x=document.getElementById("demo");
x.innerHTML=document.firstChild.nodeName;
}
</script>
</body>
</html>
时间： 2024-10-13 11:46:57