Html & Script

outerHTML 을 이용하여 Reload 없이 문자열 추가

컨텐츠 정보

본문

웹채팅 프로그램 만들때 iframe과 응용하여 쓰이는 방법으로 알고 있습니다.

<HTML>
<HEAD>
<TITLE> 초보리눅서의 WEBINFO </TITLE>
<script language="javascript">
function add_word(str)
{
hooshim.outerHTML += str+"<br>";
add.inword.value="";
add.inword.focus();
}
</script>
</HEAD>

<BODY>
<div style="font-size:10pt">
<U>페이지가 RELOAD 되지 않은 상태에서 그냥 문장이 추가되는 자바스크립트 예제 입니다.</u><br><br>
<b>outerHTML</b> 이라는 스크립트를 이용하여 만든 예제 입니다. <br>
만약에 추가하는것이 아니라 교체를 한다면 이런식으로 위의 스크립트를 변경하면 됩니다.<br>
<font color="blue">hooshim.outerHTML += str+"<br>";</font> 을 <font color="blue">hooshim.outerHTML = "<div id="hooshim" style="font-size:9pt">"+str+"</div>";</font> 로 변경 해주면 됩니다.<br><br>
<form name="add" method="post" onsubmit="add_word(add.inword.value);return false;">
내 용 : <input type="text" name="inword" size="50"> <input type="button" onclick="add_word(add.inword.value)" value="추 가">
</form>
</div>
<hr>
<br><br>
<div id="hooshim" style="font-size:9pt">
<b> 이글 아래로 차근차근 추가 됩니다.</b><br>
</div>
</BODY>
</HTML>

관련자료

댓글 0
등록된 댓글이 없습니다.
Today's proverb
가을에 피는 국화는 첫 봄의 상징으로 사랑받는 개나리를 시샘하지 않는다. 역시 봄에 피는 복숭아꽃이나 벚꽃을 부러워하지 않는다. 한여름 붉은 장미가 필 때, 나는 왜 이렇게 다른 꽃보다 늦게 피나 한탄하지도 않는다. 그저 묵묵히 준비하며 내공을 쌓고 있을 뿐이다. 그러다가 매미소리 그치고 하늘이 높아지는 가을, 드디어 자기 차례가 돌아온 지금, 국화는 오랫동안 준비해온 그 은은한 향기와 자태를 마음껏 뽐내는 것이다. (한비야)