반복문 each에서 잘 모르겠는 줄 질문합니다

$("td").each(함수) 명령은 웹브라우저화면에서 td태그들을 찾아서 한개씩 가져와서 함수를 실행해주는 명령입니다.

each 안에서 $(this) 는 반복문안에서 가져온 컨텐츠를 의미합니다.

<td>정적언어</td> 를 가져왔다고 한다면

$(this)는 <td>정적언어</td> 태그 를 의미합니다.

html() 명령은 가져온 태그의 내용을 의미합니다.

그래서

const original_content = $(this).html();

original_content 라는 변수를 만들고

그안에 $(this).html() 을 저장합니다.

$(this) 는 반복문안에서 가져온 내용. 즉 각 td 들을 의미합니다.

따라서 $(this) 는 <td>정적언어</td> 와 같은 td 태그 들이 되고요.

$(this).html() 은 그 태그 안의 내용을 의미합니다.

따라서 $(this).html() 은 '정적언어' 가 되겠죠.

정리하자면

const original_content = $(this).html();

은

original_content 에 '정적언어' 라는 문자열을 저장하게 됩니다.

두번째

html("~~~~") 명령어는 선택된 태그의 내용을 변경하는 명령입니다.

$(this).html("aaa") 라고 실행한다면

각 태그의 내용은 aaa 로 바뀌어서 <td>aaa</td> 가 됩니다.

$(this).html("-" + original_content + "-");

의 의미는 $(this)의 내용을 "-" + original_content + "-" 로 변경한다는 것입니다.

$(this) 는 반복문안에서 선택된 태그 이고

original_content 는 이전에 저장된 '정적언어' 와 같은 td 의 내용이니

최종적으로 td태그의 내용이 -정적언어- 로 변경이 됩니다.

Inflearn Community Q&A