nanashi - EGZ-Blog

・塊で説明したいときに整理したのがECMAscript
・の終了タグの前に記述が基本。
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>無題ドキュメント</title>
<style type="text/css">
body{
	    background-color: #00F;
    }
#myid{
	    background-color: #ffff00;
}
p{
	  color: #000;
	  cursor: pointer;
		background: #fff;
}
</style>
<script src="dom_click.js"></script>
</head>

<body>
<h1 id="myid">DOMによる要素の指定</h1>
<p onClick="myidEvent"()></p>
<p id="myID">テスト</p>
<img src="ggg.png" width="100" height="100" alt="">
<script>
window.onload = function(){
para1 = document.getElementByid('news1Paragraph');
para2 = document.getElementById('news2Paragrapf');
para1.style.display = 'none';
para2.style.display = 'none';
title1 = document.getElementById('news1 title');
title2 = document.getElementById('news2 title');
title1.onclick = function(){
    para1.style.display = 'block'
}
title2.onclick = function(){
	   para2.style.display = 'block'
}
document.getElementById('myid').style.color = '#ff0000';
document.getElementById('myid').style.backgroundColor = '#f0f0f0';
function myidEvent(){
	    alert('押されたよ');
}
document.getElementById(myID).onclick = myidevent;

window.onload = function(){
    document.getElementByid('myID').onclick = myidEvent;
}
function myidEvent(){
    alert('押されたよ');
}
</script>
</body>
</html>