웹 프론트엔드/JavaScript
2. JavaSciprt DOM API를 사용해보기
왕초보코딩탈출
2019. 5. 27. 09:00
1. html tag에 text 변경하기
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaSciprt DOM API를 사용해보기</title>
</head>
<body>
<p id="dom"></p>
</body>
</html>
<Script>
document.getElementById('dom').textContent = " DOM는 Document Object Model 의 약자입니다.";
</Script>
2. Body 속성 안에 h1 tag를 추가하여 보자
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>JavaSciprt DOM API를 사용해보기</title>
</head>
<body>
<p id="dom"></p>
</body>
</html>
<Script>
document.getElementById('dom').textContent = " DOM는 Document Object Model 의 약자입니다.";
var element = document.createElement('h1');
element.textContent = 'h1 element를 추가합니다. 어디에? body 안에';
document.body.appendChild(element);
</Script>
