HTML 이벤트 속성 다음 HTML DOM을 사용하여HTML DOM을 사용하는 HTML 이벤트 속성과 이벤트 할당의 차이점은 무엇입니까?
<button onclick="displayDate()">Try it</button>
지정 이벤트 :
<script>
document.getElementById("myBtn").onclick = function(){ displayDate() };
</script>
이 두 가지의 차이점은 무엇입니까? (HTML DOM을 사용하여 이벤트 할당)을 사용하면 어떤 이점이 있습니까?
감사합니다.
장점은 js 코드를 html로 처리하지 않으면 프로그래밍 레이어를 분리 할 수 있다는 것입니다. 이렇게하면 코드를보다 깨끗하게 처리 할 수 있고 버그가 적게 듭니다. 웹 접근성 규칙 및 좋은 프로그래밍 기초를 준수하는 실습.
나는 당신이 옳다고 생각합니다. 일들을 별도로 유지하십시오. –
차이는 없습니다. OnClick은 같은 이벤트입니다.
javascript를 사용하여 다른 메소드를 호출하려는 경우 OnClick이 발생했을 때 수행 할 작업을 조작 할 수 있습니다.
HTML5 사양의 6.1.5 Events 절에 차이점 (또는 오히려 연결)이 설명되어 있습니다. 기본 차이점은 onclick과 같은 이벤트 속성에는 요소 노드의 click 속성이 함수 정의에 대한 참조 인 반면에 실행되는 JavaScript 코드 (일반적으로 함수 호출)가 포함되어 있다는 것입니다. HTML 소스에서 onclick="displayDate()"을 사용하고 브라우저의 개발자 도구에서 DOM을 검사하면 연결이 더 복잡하다는 것을 알 수 있습니다.
실용적인 차이점은 의견 및 코딩 스타일의 문제입니다. onclick 특성을 사용하면 이벤트 처리기가있는 HTML 소스 코드를 읽는 모든 사용자가 즉시 알 수 있습니다. HTML 코드를 주로 구조화 된 데이터로 읽을 때 이것은 단점이 될 수도 있습니다. 그러나 여러 요소가 동일한 이벤트 처리기를 필요로 할 때 확실한 기술적 이점이 있습니다 (예 : 클릭을 원하면 링크가 일부 처리기를 트리거합니다 (일반적인 링크 조작 이전 또는 대신). JavaScript를 사용하면 HTML 마크 업에서 동일한 onclick 속성을 복사하는 것과 반대로 모든 링크에 동일한 기능을 할당하는 루프를 만들 수 있습니다.
주요 포인트는 다음과 같습니다. HTML 마크 업 중간에 자바 스크립트 나 CSS를 넣지 마십시오. 당신이 찾는 이유가 하나 있다면, 그렇게하십시오. 나머지는 모두 잘 작동합니다. –