<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
function winOpen(){
window.open('address.html', '주소검색', 'width=200,height=200'); // 자식윈도우 생성
}
</script>
</head>
<body>
<form name="fmt">
주소:<input type='text' name='addr'>
<input type="button" value="주소검색" onclick="winOpen()">
</form>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function(){ // html을 다 읽고 난 후에
var links = document.getElementsByTagName('a'); // getElementsByTagName : 배열을 리턴함
for(var i=0; i<links.length; ++i){
links[i].onclick = function(){
window.opener.document.fmt.addr.value = this.innerHTML;
self.close();
}
}
}
</script>
</head>
<body>
<ul>
<li><a href="#">서울시 강남구 대치동</a></li>
<li><a href="#">서울시 금천구 가산동</a></li>
<li><a href="#">경기도 화성시 능동</a></li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript">
window.onload = function(){
alert('Process-event');
}
alert('Process-0')
</script>
</head>
<body>
<h1>Process-1</h1>
<script>alert('process-2')</script>
<h2>Process-2</h2>
<script>alert('process-3')</script>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<link rel="stylesheet" href="styles/layout.css" target="text/css">
<script type="text/javascript" src="scripts/showPic.js"></script>
</script>
</head>
<body>
<h1>gallery</h1>
<ul id="imagegallery">
<li>
<a href="images/fireworks.jpg" title="A fireworks dispaly" >
<img src="images/thumbnail_fireworks.jpg" alt="Firewokrs"></img></a>
</li>
<li>
<a href="images/coffee.jpg" title="A cup of black coffee" >
<img src="images/thumbnail_coffee.jpg" alt="Coffee"></img></a>
</li>
<li>
<a href="images/rose.jpg" title="A red red rose">
<img src="images/thumbnail_rose.jpg" alt="Rose"></img></a>
</li>
<li>
<a href="images/bigben.jpg" title="The famous clock">
<img src="images/thumbnail_bigben.jpg" alt="Big Ben"></img></a>
</li>
</ul>
<img id="placeholder" src="images/placeholder.gif" alt="myImage"/>
<p id="description">Choose an image</p>
</body>
</html>
function showPic(object){
console.out('were');
// 이미지 id가져오기
var clickhref = object.getAttribute('href');
var placeholder = document.getElementById('placeholder');
placeholder.setAttribute('src', clickhref);
// object의 title을 바꿔야 한다
// obj 어트리뷰트 가져오기
var title = object.getAttribute('title');
// image의 정보 가져오기
var image_info = document.getElementById('description');
// innerhtml바꾸기
//image_info.innerHTML = title;
if(image_info.firstChild.nodeType == 3){//TEXT는 NODETYPE이 3번
image_info.firstChild.nodeValue = title;
}
return false;
}
function prepareGallery(){
var imagegallery = document.getElementById("imagegallery");
var atag = imagegallery.getElementsByTagName('a');
for(var i = 0; i < atag.length; ++i){
atag[i].onclick = function(){
return showPic(this);
}
}
}
window.onload = prepareGallery;
window.onload = function(){
var id1 = document.getElementById('id1');
var id2 = document.getElementById('id2');
if(id1.firstChild.nodeType == 3)
id1.firstChild.nodeValue = '안녕';
if(id2.firstChild.nodeType == 3)
id2.firstChild.nodeValue = '세상';
}