접기
http://div.or.kr/js-studying/%ED%83%9C%EA%B7%B8%20%EA%B0%9D%EC%B2%B4%20innerHTML%20%EC%86%8D%EC%84%B1
개요 각
객체에 있는 innerHTML 속성은 태그 내부값을 읽고 , 설정 할
수 있다.
사용법
document . getElementById ( "in_test" ).innerHTML = "Hello World" ;
예제
<html>
<head>
<script type= "text/javascript">
function changeValue(){
var divTest = document . getElementById ( "test" );
divTest.innerHTML = "<b><font color='red'>값이 바뀜</font></b>" ;
}
</script>
</head>
<body>
<div id= "test" > 버튼을 눌러봐~~~ </div>
<button onClick= "changeValue()" > 날 클릭하시오 </button>
</body>
</html>
접기 접기
http://h5bak.tistory.com/82
innerHTML 사용 방법입니다. body태그 안에서 div로 innerHTML을 적용할 영역을 지정하고. 버튼 클릭 시
지정한 영역에 HTML 코드를 삽입하는 소스입니다.
<!DOCTYPE html> <html> <head> <script
type="text/javascript"> <!-- function testInnerHTML(){ var str =
""; str += "<table>"; str += "<tr>"; str +=
"<td>"; str += "HTML 태그를 삽입할 수 있습니다."; str +=
"</td>"; str += "</tr>"; str +=
"</table>"; document.getElementById("inHere").innerHTML =
str; } //--> </script> </head> <body> <table
width="100%" border="0" cellspacing="0" cellpadding="0">
<tr> <td width="100%"> <input type="button" name="btn"
value="클릭 시 innerHTML 출력" onclick="javascript:testInnerHTML();">
<div id="inHere"></div> </td>
</tr> </table> </body> </html>
접기 접기
http://blog.naver.com/PostView.nhn?blogId=pooh1310&logNo=120133248974&parentCategoryNo=10&viewDate=¤tPage=1&listtype=0
innerHTML 속성
document.write(
)를 사용하면 화면에 출력이 가능하다. 그런데 이것은 페이지가 로딩될 때에만 출력된다(지금까지 내가 알기론...). 예를 들어 이미 화면이 모두
로딩 된 다음 추가 텍스트를 특정 위치에 다시 뿌려줄 수 없다. 이런 상황에서는 <div>의 innerHTML 속성을 사용해서
화면출력을 할 수 있다.
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>innerHTML 출력</title>
<script type="text/javascript">
function printOut(){
var inputTxt = document.getElementById('input_txt').value;
var outputForm = document.getElementById('output_form');
outputForm. innerHTML = inputTxt;
}
</script>
</head>
<body>
<div>
출력할 문자열을 입력하세요 :
<input id="input_txt" type="text" />
<input type="button" value="출력" onclick="printOut();" />
</div>
<div id="output_form">
</div>
</body>
</html>
위
코드를 실행하면 getElementById('input_txt')로 입력한 텍스트의 값을 구하고, '출력' 버튼을 누르는 순간
getElementById('output_form')을 찾아서 outputForm으로 참조하고 innerHTML 속성을 바꾸어 입력 문자열을
출력한다.
오늘은
여기까지...
출처
: Web.dicnote.com
접기 접기
http://blog.daum.net/pjmtodn/1499128
<script type = "text/javascript">
function test(){
document.getElementByid('t').innerHTML = '다음';
}
</script>
<span id = 't'> 네이버 </span><br/>
<input type = 'button' value ='클릭' onclick='test()' />
접기