explorer 6, 7에선 다음 javascript가 정상동작한다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script language="javascript">
function gofunc(){
alert(document.getElementById("aaa").value);
}
</script>
</head>
<body>
<form name="frm" method="post">
<input type = "hidden" name="aaa" value="">
</form>
<a href="#" onclick="javascript:gofunc()">Click </a>
</body>
</html>
name만 지정했는데 document.getElementById 로 값을 갖고오고 있다.<html>
<head>
<title></title>
<script language="javascript">
function gofunc(){
alert(document.getElementById("aaa").value);
}
</script>
</head>
<body>
<form name="frm" method="post">
<input type = "hidden" name="aaa" value="">
</form>
<a href="#" onclick="javascript:gofunc()">Click </a>
</body>
</html>
이를 explorer 8에서 실행하면 "개체가 필요합니다."라는 javascript 에러가 발생한다.
다음과 같이 id를 등록하고 가져와야한다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title></title>
<script language="javascript">
function gofunc(){
alert(document.getElementById("aaa").value);
}
</script>
</head>
<body>
<form name="frm" method="post">
<input type = "hidden" id="aaa" value="">
</form>
<a href="#" onclick="javascript:gofunc()">Click </a>
</body>
</html>
<html>
<head>
<title></title>
<script language="javascript">
function gofunc(){
alert(document.getElementById("aaa").value);
}
</script>
</head>
<body>
<form name="frm" method="post">
<input type = "hidden" id="aaa" value="">
</form>
<a href="#" onclick="javascript:gofunc()">Click </a>
</body>
</html>
메소드이름을 보면 getElementById 이므로 id가 있어야 하는게 당연한것 같기도 하고.. script 언어라 그런가...
explorer 6,7는 그냥 돌다 explorer 8 들어와서 좀 엄격하게 체크하도록 바뀌었다.
http://msdn.microsoft.com/en-us/library/cc288472(VS.85).aspx (한글 : http://9eye.net/entry/Whats-New-In-Internet-Explorer-8)
해당 내용 부분 인용 :
HTML and DHTML Improvements
The new HTML 4.01 implementation is now much more interoperable. The improvements include:
- The object tag image fallback is interoperable with other browsers. For example, an object tag without dimensions is now the same size as the image, instead of 0 x 0 pixels.
- The button element submits its value attribute instead of its innerHTML, which means you can use the button element for cross-browser FORM scenarios.
- The getElementById method is now case-sensitive, and it no longer incorrectly performs searches using the NAME attribute.
- The setAttribute method is now case-insensitive; you do not need to use "camel case" (for example, "camelCaseWord") to specify attributes. It also correctly identifies HTML attributes such as CLASS and FOR.
For more information, see:
추가로 doctype이 잘못된줄 알고 살피고 있었다.
맨위에 정의된 doctype을 보면
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">를 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> 로 고치면 상관없이 잘 동작한다.
하지만 이럴경우 브라우저가 막장렌더링으로 인해 느려진다.(쿼크모드)
(추가 설명 : http://blog.naver.com/rwill?Redirect=Log&logNo=10034933266)
https://developer.mozilla.org/ko/Migrate_apps_from_Internet_Explorer_to_Mozilla 를 보면 모질라에선 표준모드(엄격), 반표준모드(엄격과 막장의 중간), 쿼크모드(막장)를 지원한다.
w3c 에서 권장하는 doctype 형식은 http://www.w3.org/QA/2002/04/valid-dtd-list.html 에서 확인 가능.
이와 별개로 유사한 동작을 보이는게 있는데 explorer 8 의 버그성(?)인 경우가 있다.
http://www.microsoft.com/communities/newsgroups/list/en-us/default.aspx?mid=2612767d-de6b-47d3-b8a2-aeec9a6f1d9f&dg=microsoft.public.internetexplorer.general
해당 글의 샘플소스는 다음과 같은데 explorer 8에서만 에러를 발생시킨다. (FF에서도 잘됨)
댓글보면 코드가 막장인데 브라우저 탓하냐 어쩌구 저쩌구 하는데 이게 왜 잘못된 코드인지는 모르겠다. (영어 ==;)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
</head>
<body>
<a href="#" onclick="document.getElementById( 'regel_1' ).style.display =
'none';">Crash</a>
<table>
<tr id="regel_1">
<td>Test</td>
<input type="hidden">
</tr>
<tr>
<td>Test2</td>
<input type="hidden">
</tr>
</table>
</body>
</html>
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
</head>
<body>
<a href="#" onclick="document.getElementById( 'regel_1' ).style.display =
'none';">Crash</a>
<table>
<tr id="regel_1">
<td>Test</td>
<input type="hidden">
</tr>
<tr>
<td>Test2</td>
<input type="hidden">
</tr>
</table>
</body>
</html>
'가지가지' 카테고리의 다른 글
| 윈도우 콘솔 명령 (0) | 2011.06.16 |
|---|---|
| 크로스 케이블로 내부망/외부망PC 연결하여 사용하기 (0) | 2011.03.05 |
| 리눅스 데스크탑 사용중.. (0) | 2010.01.20 |
| weblogic version 확인방법 (0) | 2009.06.18 |
| datasource jndi 명을 다른 datasource와 매핑시키기 - jeus5 (0) | 2009.02.24 |
| startup class - jeus 5 (0) | 2009.02.24 |
| OS별 ps 명령어 (0) | 2009.02.23 |
| ntfs-3g mount (0) | 2009.02.12 |