queryselector : 만나는 첫번재 태그를 가져온다.
document.querySelector(".myclass");
queryselectorAll : 해당하는 모든 태그를 가져옴
let nodes = document.querySelectorAll('td')
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script>
window.onload = function() {
var tags = document.getElementsByTagName('td')
console.log(tags)
tags[0].innerHTML = '아이디'
// let nodes = document.querySelector('td')
// 왜 td 태그 중 첫번째 요소만 나오냐? 그게 특징이야.
let nodes = document.querySelectorAll('td')
console.log(nodes)
nodes[1].innerText = '패스워드'
}
</script>
</head>
<body>
<table border="1" style="width:100px; height: 100px">
<tr>
<td>ID</td>
</tr>
<tr>
<td>PASSWORD</td>
</tr>
</table>
</body>
</html>'웹 프로그래밍 > JavaScript' 카테고리의 다른 글
| [JS] DOM level 2 : 표준 이벤트 모델 (이벤트 캡쳐링, 이벤트 버블링 비교) (0) | 2020.06.22 |
|---|---|
| [JS] DOM level 0 : 고전 이벤트 모델 vs 인라인 이벤트 모델 (0) | 2020.06.22 |
| [JS] 버튼을 누를 때마다 동적으로 변하는 페이지 만들기(숫자 증감) (0) | 2020.06.21 |
| [JS] 버튼을 누를 때마다 동적으로 변하는 페이지 만들기(계산기) (0) | 2020.06.21 |
| [JS] 작성한 함수가 제대로 작동하지 않는 문제 (원인 : 자스크립트 내에 이미 있는 함수일 경우) (0) | 2020.06.21 |
