🏃🏻♀️배운 것
id를 이용한 요소 노드 취득
HTML 요소에 id 어트리뷰트를 부여하면 Id 값과 동일한 이름의 전역 변수가 암묵적으로 선언되고 해당 노드 객체가 할당되는 부수효과가 있다. 단, id 값과 동일한 전역 변수가 이미 선언되어 있으면 이 전역 변수에 노드 객체가 재할당되지 않는다.
<body>
<div id="overview"></div>
<script>
console.log(overview === document.getElementById('overview')); //true
delete overview;
console.log(overview); // <div id="overview"></div>
</script>
</body> <body>
<div id="overview"></div>
<script>
let overview = 1;
console.log(overview); //1
</script>
</body>
개발 용어
- Collection : '프로그래밍 언어가 제공하는 값을 담을 수 있는 컨테이너'
css 선택자
// 인접 형제 선택자
// p 요소 의 형제 요소 중에 p 요소 바로 뒤에 위치하는 ul 요소를 선택
p + ul {}
//일반 형제 선택자
// p 요소의 형제 요소 중에 p 요소 뒤에 위치하는 ul 요소를 모두 선택
p ~ ul {}
css 선택자를 이용한 요소 노드 취득
Document.prototype/Element.prototype.querySelector 메서드는 인수로 전달한 CSS 선택자를 만족시키는 하나의 요소 노드를 탐색하여 반환한다.
✍🏻회고(잘한점, 아쉬운점,깨달은점)
업무적인 회고
- DOM 에 대해 잘알지 못했을때 단순히 getElementById 메서드를 사용할 때는 인수로 id 문자열을 넣으면 요소 노드를 가져올수있고, querySelector 메서드를 사용할 때는 앞에 #id 문자열을 넣으면 된다라고 알고 있었는 데 getElementById는 id를 이용한 요소 노드 취득을 위한 메서드이고 querySelector는 css 선택자를 이용한 메서드라서 이러한 구분이 생기는구나 이해할 수 있었다. 또 querySelector 는 id 와 class 뿐 아니라 css 선택자를 이용한 메서드이기 때문에 "ul> li"와 같은 좀 더 포괄적이게 사용할 수 있구나 깨달았다.
- " id를 이용한 요소 노드 취득" 인데 " id요소를 이용한 노드 취득" 으로 잘못 사용하는 등 특정 개발용어를 정확히 숙지하지 않아 중구난방으로 작성하고 말했다는 것을 깨달았다. 쓰고 말하기 전에 내가 이 용어를 정확히 알고 사용하는 것인지 다시 생각하고 사용하는 습관을 길러야겠다 생각했다.
개인적인 회고
- 존경 : 최근 느낀 점으로 상대방이 살아온 삶에 대한 인정이 들 때 내 안에서 긴밀히 그의 목소리를 존중한다는 점이다. 부모 자식간에 관계나 깊은 사이에서 나도 모르는 사이 상대를 쉽게 판단하거나 함부로 대할 때가 있다. 그런 경우 상대방의 결정은 논리적이지 못하다라는 생각이 기저에 깔려서 상대방의 말을 귀담아 듣지 않고 행동하는 경향이 있는데 이럴 때 내면 깊이에는 상대방을 그다지 좋지 않게 본 경우 더러 그런 생각과 행동을 하게 된다고 느꼈다. 물론 사람의 인생을 판단해서는 안되고 모든 사람의 목소리를 긴밀히 들을 필요도 없겠지만 결혼 상대와 같이, 인생이라는 긴 여정을 같이 걸어갈 상대를 찾는 경우, 내가 과연 힘든 상황속에서도 상대방의 목소리를 긴밀하게 듣고 존중할 수 있느냐,를 물었을 때 생각해볼 만한 거 같다. 나는 상대방을 인간 대 인간으로 멋있다고 생각하고 존중하는가? 또 나는 그런 멋진 사람인가?
🧐개선 방법
- 잘하고 있다~!
'성장과회고' 카테고리의 다른 글
| 7.18.2024(목) TIL (0) | 2024.07.18 |
|---|---|
| 7.16.2024(화) TIL (0) | 2024.07.16 |
| 7.8.2024 TIL (3) | 2024.07.08 |
| 2024.6.20(목) TIL (0) | 2024.06.20 |
| TIL 2023.01.17 (0) | 2024.01.17 |
