링크 · http://api.jquery.com/id-selector/



id selector

ID Selector (“#id”) - 아이디 선택자 (“#아이디명”)

설명: 해당 아이디로 된 하나의 요소를 찾습니다.

자바스크립트의 getElementById() 와 같습니다.


아이디 선택자는 두개 이상의 요소가 동일한 아이디로 할당된 경우,

해당 아이디를 사용하는 첫번째 요소만 가져옵니다. 

동일한 아이디를 사용하는 요소가 둘 이상인 문서는 유효하지 않으며, 

이 경우 신뢰 할 수 없습니다.


예제: 아이디가 “myDiv”인 요소에 빨간 선을 부여합니다.

+추가 ID가 "my.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="notMe"><p>id="notMe"</p></div>
<div id="myDiv">id="myDiv"</div>
<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>
$( "#myDiv" ).css( "border", "3px solid red" );
// 코드 해설: 아이디가 "myDiv"인 요소를 찾아 빨간선을 적용합니다.
$( "#myID\\.entry\\[1\\]" ).css( "border", "3px solid red" );
// 코드 해설: 아이디가 "myId"이면서 [1]번째 요소를 찾아 빨간선을 적용합니다.
</script>

</body>
</html>


'!' 카테고리의 다른 글

[jQuery]:filter selector  (0) 2018.04.22
[jQuery]:Multiple Selector ("selector1, selector2, selector3 ")  (0) 2018.04.15
[jQuery]:Element Selector ("tag")  (0) 2018.04.15
[jQuery]:Class Selector(".class name")  (0) 2018.04.15
[jQuery]:All Selector ("*")  (0) 2018.04.15

+ Recent posts