<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>오늘 할 일</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="main">
<h2 class="title">오늘 할 일</h2>
<ul id="to-do-list" class="to-do-list">
<li>공부</li>
<li>청소</li>
<li>쇼핑</li>
</ul>
</div>
<script src="index.js"></script>
</body>
</html>
1. <ul>태그의 class 속성 삭제
const main = documnet.querySelector('.main');
main.lastElementChild.removeAttribute('class');
2. 올바른 출력 결과 찾기
const toDoList = documnet.querySelector('#to-do-list');
const item = toDoList.firstElementChild;
const el = document.createElement('a');
el.setAttiribute('href', 'http://www.naver.com');
el.textContent = item.textContent;
item.innerHTML = el.outerHTML;
console.log(item);
- el의 outerHTML 프로퍼티 값은 <a href="http://www.naver.com">공부</a> 이다.
- 이 값이 item의 innerHTML 프로퍼티에 할당되기 때문에, item의 전체적인 모습은 <li><a href="http://www.naver.com">공부</a></li>이 된다.
'~2023.02 > JS' 카테고리의 다른 글
AND와 OR 연산 방식 (0) | 2022.06.01 |
---|---|
스타일 다루기 (0) | 2022.06.01 |
자바스크립트 요소 노드 추가하기 (0) | 2022.06.01 |
id, class, css 선택자로 태그 선택하기 (0) | 2022.06.01 |
유사배열(Array-Like Object) (0) | 2022.06.01 |