<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Javascript Window Object</title>
<script>
window.onload = function() {
// 삭제버튼 : 이벤트 설정
document.querySelector('input[type=submit]').onclick = function(){
alert('h1');
// 삭제 대상
var remove_h1 = document.getElementById('header-1');
// 삭제 대상을 포함하는 문서객체
var parent = document.body;
parent.removeChild(remove_h1);
};
};
</script>
</head>
<body>
<div id="header-1">1</div>
<div id="header-2">2</div>
<br>
<input type="submit" value="H1-0 삭제">
</body></html>
'front-end > Javascript & jquery' 카테고리의 다른 글
| [jquery] 문서 객체 선택과 탐색 / filter / end / eq / first / last / add (0) | 2020.12.02 |
|---|---|
| [jquery] 배열관리 / each / addclass (0) | 2020.12.02 |
| [jquery] 기본 (0) | 2020.12.02 |
| [자바스크립트] 이벤트 전달 / 막기 (bubbling) / stopPropagation (0) | 2020.11.30 |
| [자바스크립트] 유효성검사 (0) | 2020.11.30 |
| [자바스크립트] 이벤트 (0) | 2020.11.30 |
| [자바스크립트] 문서객체의 스타일 조작 (0) | 2020.11.30 |