2008/03/19 23:48
Firefox에서 prototype.js를 사용하게 되면 prototype의 Element.Methods와 Element.Methods.Simultated 정의되어 있는 method와 property가 HTMLElement.property에 추가되게 됩니다.
그렇기 때문에, IE에서는 element를 생성할 때, $()로 한 번 감싸주거나 Element.extend를 한 번 더 호출해서 prototype.js의 Element 기능을 추가합니다.
출처: How Prototype extends the DOM
P.S >
다른 분과 IE에서 HTMLElement.prototype 에 접근이 안된다는 얘기를 했더니 그럴리가 없다는 얘기를 하시면서 new로 생성이 안되어서 그렇다는 의견을 얘기한 적이 있었습니다. 그 당시에 실험을 해보고 글로는 안 썼었는데 정리하는 차원에서 추가합니다.
IE에서 몇 가지 실험을 해보면,
if (F.ElementExtensions) {이렇게 추가되게 되면, 다음의 효과를 얻습니다. HTMLElement를 생성할 때, Element.Methods에 정의되어 있는 메소드를 그대로 상속받게 되는거죠. 예를 들면 element를 생성만 했슴에도 Element.Methods에 정의되어 있는 getDimension()에 접근이 가능하게 되는거죠.
// copy(source, destination)
copy(Element.Methods, HTMLElement.prototype);
copy(Element.Methods.Simulated, HTMLElement.prototype, true);
}
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"그러나, IE에서는 HTMLElement 인터페이스(정확히는 HTMLElement 인터페이스를 구현한 Object)에 어떠한 메소드나 프로퍼티 추가를 허락하지 않습니다. 그렇기 때문에 IE에서 위의 코드를 실행하게 되면 동작을 하지 않습니다.
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="prototype_v1511.js"></script>
<title>Insert title here</title>
</head>
<body
onload="var divElm = document.createElement('div');
alert(divElm.getDimensions);">
</body>
</html>
그렇기 때문에, IE에서는 element를 생성할 때, $()로 한 번 감싸주거나 Element.extend를 한 번 더 호출해서 prototype.js의 Element 기능을 추가합니다.
출처: How Prototype extends the DOM
P.S >
다른 분과 IE에서 HTMLElement.prototype 에 접근이 안된다는 얘기를 했더니 그럴리가 없다는 얘기를 하시면서 new로 생성이 안되어서 그렇다는 의견을 얘기한 적이 있었습니다. 그 당시에 실험을 해보고 글로는 안 썼었는데 정리하는 차원에서 추가합니다.
IE에서 몇 가지 실험을 해보면,
alert(HTMLElement);즉, HTMLElement에 접근할 수 조차 없게 되겠죠. 그러나, new로 생성하지 못하기 때문에 new가 원인이 된다는 확인해보지 못했었는데요. 곰곰히 생각하다보니 IE에서 img 태그의 경우 new Image()로 생성할 수 있다는 게 생각이 나더군요. 그러나, 역시 Image의 경우에도 prototype에 접근할 수 없었습니다.
// HTMLElement 가 정의되어 있지 않다고 에러가 발생합니다. (Element 동일)
alert(Image); // Object가 뜹니다.결론은 IE에서는 HTMLElement나 Tag에 직접접근할 수 없다고 보는게 맞다고 생각이 됩니다.
alert(Image.prototype); // undefined가 나오네요.
이올린에 북마크하기
이올린에 추천하기'잡학사전 > JS(Library)' 카테고리의 다른 글
| Canvas 태그에 그린 내용을 저장하고 싶을 때... (0) | 2008/07/01 |
|---|---|
| Objective-J (0) | 2008/06/29 |
| prototype.js, HTMLElement에 method를 추가하기 (4) | 2008/03/19 |
| script.aculo.us의 effects.js 정리 (4) | 2008/02/23 |
| YUI - compressor (0) | 2008/02/03 |
| 웹사이트의 타이틀을 쉽게 복사하기 (2) | 2008/01/10 |
Trackback Address :: http://okjungsoo.tistory.com/trackback/7953722
