Mozilla 한국 커뮤니티

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ko">
	<head>
		<title>Test</title>
		<meta http-equiv="content-type" content="text/html; charset=euc-kr"/>
	</head>
	<body>
		<script type="text/javascript">
			var input = document.createElement("input");
			input.setAttribute("type", "text");
			input.setAttribute("name", "name");
			input.setAttribute("value", "333");

			var container = document.createElement("div");
			container.appendChild(input);

			alert(container.innerHTML);
		</script>		
	</body>
</html>

폼에 동적으로 요소를 추가하기 위해 위와같은 테스트 코드를 만들어서 IE, FF에서 각각 돌려보니 FF에서는 의도한대로 <input value="333" name="name" type="text"> 라는 결과가 나오지만 IE에서는 <INPUT value=333> 라고만 나옵니다.

보니까 IE에서는 setAttribute의 첫번째 인수가 name, value 같은 특정한 단어일때는 동작을 안하는것 처럼 보이더라구요..

이 문제를 어떻게 해결하면 좋을까요?

(모질라 포럼에 올리기에는 좀 어울리지 않는 질문이지만.. 양해 부탁드리겠습니다 - -;)

저도 한때 이 문제 때문에 열심히 삽 한적이 있습니다.

아래 링크는 제가 예전에 적은글인데 이 부분에 대한 내용이 포함되어 있습니다.
도움이 될 수 있지 않을까 싶습니다.

viewtopic.php?p=14962#14962

name이나 value는 attribute가 아니기 때문에 setAttribute로 제어할 수 없을 겁니다. (그외에 id라든가 몇가지 attribute가 아닌 값들이 있습니다.)
value라면, object.value 처럼 쓴다거나 하는 방식이 맞을 겁니다.

그렇군요.. 답변 감사드립니다

createElement("input") 같은 식으로만 되는건줄 알았는데 createElement('<input type="text" name="n">'); 이렇게 쓰면 되는거였군요.. outerHTML = '<input type="text" name="n">'; 이렇게 쓰면 인식이 안되길래 머리뜯고있었는데..

내일 테스트 해봐야겠습니다.

Mozilla 한국 커뮤니티

setAttribute의 오작동

setAttribute의 오작동

휴.. 정말 익스는 ㅡㅡ;