방법 1, setAttribute
var obj = document.getElementById("obj");
obj.setAttribute("onclick", "javascript:alert('test');"); 🎜>여기서는 setAttribute를 사용하여 간단하고 이해하기 쉬운 onclick 속성을 지정합니다.
그러나 IE가 이를 지원하지 않는 것은 아니지만 setAttribute 사용을 지원하지 않습니다. 객체 속성 및 컬렉션 속성을 포함한 특정 속성을 설정하려면, 즉 setAttribute를 사용하여 스타일을 설정하면 onclick, onmouseover 속성이 IE에서 작동하지 않습니다.
방법 2, attachmentEvent 및 addEventListener 사용 IE는 attachmentEvent를 지원합니다.
obj.attachEvent("onclick", Foo)
function Foo()
{
Alert("Test");
}
함께 작성할 수도 있습니다.
obj.attachEvent("onclick", function(){alert("Test");})
다른 브라우저 지원 addEventListener
obj.addEventListener("click", Foo, false);
function Foo()
{
alert("test")
}
도 함께 작성할 수 있습니다.
obj.addEventListener("click", function(){alert("test");}, false)
attachEvent 이벤트는 onclick과 같이 켜져 있지만 addEventListener는 켜져 있지 않습니다. 을 클릭하세요.
그런데 addEventListener의 세 번째 인수(거의 사용되지 않음) useCapture - true인 경우 useCapture는 사용자가 캡처를 시작하려고 함을 나타냅니다. 캡처가 시작되면 지정된 유형의 모든 이벤트는 트리에서 그 아래의 EventTargets로 전달되기 전에 등록된 EventListener로 전달됩니다. 트리에 버블링되는 이벤트는 캡처를 사용하여 지정된 EventListener를 실행하지 않습니다.
종합응용프로그램
if (window.attachEvent)
{
//IE의 이벤트 코드
}
else
{
//다른 브라우저의 이벤트 코드
}
방법 3, event = function
예: obj.onclick = Foo 이것은 여러 브라우저에서 지원되며 이전 사양입니다( 방법 2는 DOM2 사양)이지만 사용하기 쉽기 때문에 많은 상황에서 사용됩니다.
내 솔루션은 다음과 같습니다.
function show(){
alert("Hello, world!!!")
}
obj.setAttribute('onclick' ,document .all ? eval(function(){show()}) : 'javascript:show()');
매우 간단하고 브라우저와 호환되는 것 같지만 다른 효과가 있는지는 모르겠습니다. 그것을 교체하는 더 좋은 방법이 있습니까?