dom 객체의 innerText와 innerHTML의 차이점은 무엇입니까?

이 문서에서는 DOM 개체의 innerText와 innerHTML 간의 관련 차이점을 설명합니다.

innerText는 모든 출력을 페이지에 텍스트 형식으로 표시하고, inderHTML은 요소의 HTML 구조를 반환하고 콘텐츠를 기반으로 자동으로 DOM을 생성합니다.

elem.children과 elem.childNodes의 차이점은 무엇인가요?

elem.children은 텍스트 노드가 아닌 DOM 노드 개체를 가져오는 것이고,
elem.childNodes는 빈 노드와 텍스트 노드를 포함한 모든 DOM 노드를 가져오는 것입니다.

요소를 쿼리하는 일반적인 방법은 몇 개인가요?

getElementsById(): 지정된 ID 속성을 가진 요소 찾기

getElementsByClassName(): 지정된 클래스 속성을 가진 요소 찾기

getElementsByTagName(): 지정된 태그를 가진 요소 찾기

getElementsByName(): name 속성을 가진 요소 찾기

querySeletor(): CSS 선택기와 동일하며 일치하는 레이블이 있는 첫 번째 노드를 찾습니다.

querySeletorAll(): CSS 선택기와 동일하며 일치하는 레이블이 있는 모든 노드를 찾습니다.

요소를 만드는 방법은 무엇입니까? 요소에 속성을 설정하는 방법은 무엇입니까?

createElement()는 HTML 요소를 생성하며 매개변수는 <> 대괄호 없이 태그 이름입니다.

createTextNode()는 텍스트 노드를 생성하며 매개변수는 텍스트 콘텐츠입니다.

setAttribute()는 요소 속성을 설정하는 데 사용됩니다.

요소를 추가하거나 삭제하시겠습니까?

appendChild(): 요소 끝에 요소 추가

insertBefore(): 요소 앞에 요소 추가

removeChild(): 요소 제거

DOM0 이벤트와 DOM2 레벨의 이벤트 수신 사용법이 다릅니다. 차이점은 무엇입니까?

DOM 레벨 0 이벤트는 함수 할당을 이벤트 핸들러에 바인딩하는 것이며 동시에 하나의 이벤트만 처리할 수 있습니다.

DOM2 레벨은 이벤트 핸들러를 지정하고 삭제하는 작업을 처리하는 두 가지 방법을 정의하고 이벤트에 대해 여러 이벤트 핸들러를 추가할 수 있습니다.

attachEvent와 addEventListener의 차이점은 무엇인가요?

매개변수 개수가 다릅니다. addEventListener에는 3개의 매개변수가 있고, attchEvent에는 2개만 있습니다.attachEvent에 의해 추가된 시간 핸들러는 버블링 단계에서만 발생할 수 있습니다. addEventListener의 세 번째 매개변수는 추가된 이벤트 핸들러가 캡처에 있는지 여부를 결정할 수 있습니다. 단계 또는 버블링

첫 번째 매개변수는 다른 의미를 가집니다. addEventListener의 첫 번째 매개변수는 이벤트 유형(예: click, load)이고, addachEvent의 첫 번째 매개변수는 이벤트 처리 함수 이름(onclick, onload)을 지정합니다.

이벤트 핸들러 addEventListener의 범위는 다릅니다. addEventListener의 범위는 요소 자체입니다. 이는 트리거 요소를 참조하며, attachmentEvent 이벤트 핸들러는 전역 변수에서 실행됩니다. 이는 window

여러 이벤트 핸들러를 추가하는 경우 이벤트의 경우 실행 순서가 다르므로 addEventListener는 추가된 순서대로 실행되고, addachEvent는 불규칙한 순서로 여러 개의 이벤트 핸들러를 추가합니다. (추가된 메소드가 거의 없는 경우 대부분 추가된 순서의 역순으로 실행되지만, 너무 많으면 순서가 불규칙합니다.) 따라서 여러 개를 추가할 때 기능 실행 순서에 의존하는 경우 직접 처리해야 하며 브라우저에 의존할 수 없습니다.

IE 이벤트 버블링과 DOM2 이벤트 전파 메커니즘을 설명하시겠습니까?

IE 이벤트 버블링은 이벤트가 가장 안쪽 요소에서 시작하여 HTML 루트 노드까지 계층별로 위쪽으로 전파된다는 것을 의미합니다.

DOM2 이벤트 전파 메커니즘:

이벤트 캡처 단계: 이벤트는 루트 노드부터 아래쪽으로 계층별로 이벤트의 대상 노드를 검색합니다.

대상 단계: 대상 노드에 도달하고 대상 이벤트를 실행합니다.

이벤트 버블링 단계: 이벤트는 대상 노드에서 루트 노드까지 계층별로 추적됩니다.

이벤트 버블링을 중지하는 방법은 무엇입니까? 기본 이벤트를 방지하는 방법은 무엇입니까?

이벤트 버블링을 중지하려면 stopPropagation() 함수를 사용하세요.

eventDefault() 함수를 사용하여 이벤트의 기본 동작을 취소하세요.

코드 질문

요소를 클릭할 때 콘솔이 각 요소 li의 텍스트 콘텐츠를 표시하도록 요구하는 다음 코드가 있습니다. 호환성은 고려되지 않습니다

<ul class="ct">
    <li>这里是</li>
    <li>饥人谷</li>
    <li>前端6班</li></ul>
  <script>var ct = document.querySelector(&#39;.ct&#39;),
    li= ct.querySelectorAll(&#39;li&#39;);for(var i= 0; i< li.length; i++){
    li[i].onclick = function(){        console.log(this.innerText);
    }
}</script>

이 글에서는 dom 객체의 innerText와 innerHTML 사이의 관련 차이점을 설명합니다. 더 많은 관련 내용을 보려면 PHP 중국어 웹사이트를 참고하세요.

관련 권장 사항:

JS에 대한 몇 가지 기본적인 질문

프론트 엔드 JS를 사용하여 요구 사항을 모듈화하는 방법.

위 내용은 dom 객체의 innerText와 innerHTML의 차이점은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!