在學習CSS樣式的時候，我們肯定會遇到ID選擇器。用法一類的這裏就不說了，說一說對ID選擇器可能存在的一個誤區。
誤區：id選擇器具有唯一性？
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
#id {
background-color: #00ff00;
}
</style>
</head>
<body>
<div style="width:200px">
<p id="id">哦豁</p>
<p id="id">哦豁</p>
</div>
</body>
</html>上面違反了一般教程中說到的唯一性，估計大部分初學者會認爲，其中有一個標籤的樣式肯定不能生效，但實際上如下圖
納尼？兩個都生效，這不是和類選擇器一樣了嗎，都是通用的。OK，實際上這是對唯一性的理解錯了，ID選擇器設置的樣式其實也能夠文檔中多次出現並使用。
但是！但是！但是！重要的轉折說三邊，在JS進行dom操作是就存在問題了，如下面的例子。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
#id {
background-color: #00ff00;
}
</style>
</head>
<body>
<div style="width:200px">
<p id="id">哦豁</p>
<p id="id">哦豁</p>
</div>
<script type="text/javascript">
document.getElementById("id").style.backgroundColor="#ff0000";
</script>
</body>
</html>按照之前的想法，JS應該針對兩個p標籤都做了樣式修改，但實際上只有第一個修改了。如下圖
於是在這裏就引申出了所謂的“唯一性”，它是針對JS而言的，當文檔存在多個相同ID時，通過getElementById方法獲取到的是在文檔中第一個出現該ID的標籤(DOM節點對象)，故都推薦ID在文檔中最好只出現一次，即“唯一性”。
在實際開發中，也是遵循這樣的原則，class用於CSS佈局，id用於JS操作DOM節點對象。