유블로그

[jQuery] DOM 탐색 본문

JavaScript & jQuery

[jQuery] DOM 탐색

yujeong kang 2020. 9. 10. 16:51

Google CDN 사용

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DOM 탐색</title>
<script 
	src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
	<span id="div1">id가 div1인 span 영역</span>
	<div>div 영역</div>
	<span name="div3">name이 div3인 span 영역</span>
	<span class="div4">class가 div4인 span 영역</span>
	<script type="text/javascript">
      var element1 = $("#div1");
      var element2 = $("div").eq(0);
      var element3 = $("[name=div3]").eq(0);
      var element4 = $(".div4").eq(0);

      console.log(element1.html());
      console.log(element2.html());
      console.log(element3.html());
      console.log(element4.html());
	</script>
</body>
</html>

$ 기호를 이용한다.

id 는 #, element 는 이름자체로, 이름으로 [name = ], 클래스이름은 . 으로 접근.

 

'JavaScript & jQuery' 카테고리의 다른 글

[jQuery] DOM 요소 필터링 - 필터선택자  (0) 2020.09.11
[jQuery] DOM 속성 탐색 - 속성선택자  (0) 2020.09.10
[jQuery] DOM 계층구조 탐색 선택자  (0) 2020.09.10
[jQuery] DOM 요소 탐색 - 요소선택자  (0) 2020.09.10
[JavaScript] DOM 탐색  (0) 2020.09.10
'JavaScript & jQuery' Related Articles more