ID 选择器 (“#id”)
id selector
描述:选择一个带有给定的元素id属性的元素。
加入于: 1.0
jQuery( "#id" )id: 要搜索的ID,通过元素的元素属性id指定。
针对id选择器,jQuery会使用JavaScript函数document.getElementById()
,它十分有效。当别的选择器匹配到id选择器时,比如说h2#pageTitle
,jQuery在识别元素是否匹配之前实施了一个额外的检查。
用一个id选择器作为参数,调用jQuery()
或者($()
),将返回一个jQuery对象,它包含了一个或零个DOM元素。
每一个id值必须只在document中使用一次。如果更多的元素被分配了同样的id,则使用id查询将只选择DOM中的第一个匹配的元素。然而,这种行为并不应该被依赖;一个document中不止一个元素使用相同的id是不合法的。
如果id包含了一些特殊字符,比如说句号(.)和冒号(:),你就必须用反斜杠转义这些字符。
示例
选择带id“myDiv”的元素,并给它一个红色边框。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>id demo</title> <style> div { width: 90px; height: 90px; float: left; padding: 5px; margin: 5px; background-color: #eee; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <div id="notMe"><p>id="notMe"</p></div> <div id="myDiv">id="myDiv"</div> <script> $( "#myDiv" ).css( "border", "3px solid red" ); </script> </body> </html>
演示结果
选择带id"myID.entry[1]"的元素,并给它一个红色边框。注意,某些字符必须如何用反斜杠转义。
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>id demo</title> <style> div { width: 300px; float: left; padding: 2px; margin: 3px; background-color: #eee; } </style> <script src="https://code.jquery.com/jquery-1.10.2.js"></script> </head> <body> <div id="myID.entry[0]">id="myID.entry[0]"</div> <div id="myID.entry[1]">id="myID.entry[1]"</div> <div id="myID.entry[2]">id="myID.entry[2]"</div> <script> $( "#myID\\.entry\\[1\\]" ).css( "border", "3px solid red" ); </script> </body> </html>
演示结果