一、document.write() 的用法：（开个新页面，将文本框的值写入新页面）
<script type="text/javascript">
window.onload = function(){
var oBut = document.getElementById("div1");
var oTex = document.getElementById("text");
oBut.onclick = function(){
var oWin = window.open("about:black");
oWin.document.write(oTex.value);
}
}
</script>
<body>
<textarea id="text" rows="10" cols="50"></textarea><br/>
<input type="button" id="div1" value="添加"/>
</body>
二、window.location = url ----> 打开该网址
三、兼容 事件对象的写法:
<script type="text/javascript">
document.onclick = function(ev){
var oEvent = ev || event;
alert(oEvent.clientX + "," + oEvent.clientY);
}
</script>
四、事件冒泡 和 阻止事件冒泡：
<script type="text/javascript">
window.onload = function(){
var oDIV1 = document.getElementById('div1');
var oDIV2 = document.getElementById('div2');
oDIV1.onclick = function(){
alert(this.style.background);
}
oDIV2.onclick = function(ev){
var oEv = ev || event;
oEv.cancelBubble = true;
alert(this.style.background);
}
}
</script>
<div id="div1" style="width:500px;height:300px;background:red;">
<div id="div2" style="width:250px;height:150px;background:green;"></div>
</div>
五、贪吃蛇：
<body>
<div></div><div></div><div></div><div></div><div></div>
<div></div><div></div><div></div><div></div><div></div>
<div></div><div></div><div></div><div></div><div></div>
<div></div><div></div><div></div><div></div><div></div>
<div></div><div></div><div></div><div></div><div></div>
</body>
<style>
div {
width:10px;
height:10px;
background:red;
position:absolute;
}
</style>
<script type="text/javascript">
window.onload = function(){
var oDIV1 = document.getElementsByTagName('div');
var i = 0;
document.onmousemove = function(ev){
var oEv = ev || event;
for(i=oDIV1.length-1;i>0;i--){
oDIV1[i].style.left = oDIV1[i-1].style.left
oDIV1[i].style.top = oDIV1[i-1].style.top
}
oDIV1[0].style.left = oEv.clientX+'px';
oDIV1[0].style.top = oEv.clientY+'px';
}
}
</script>
六、keyCode
<script type="text/javascript">
document.onkeydown = function(ev){
var oEv = ev || event;
var oDiv = document.getElementById("DIV");
if(oEv.keyCode == 37){
oDiv.style.left = oDiv.offsetLeft-10+'px';
}else if(oEv.keyCode == 39){
oDiv.style.left = oDiv.offsetLeft+10+'px';
}
}
</script>
七、留言框：ctrl+enter 提交
<div>
<textarea id='txt1' rows='10' cols='40'></textarea><br/><br/>
<input type='text' id='txt2'></input>
<input type='button' id='but' value='留言'></input>
</div>
<script type="text/javascript">
window.onload = function(){
var ara = document.getElementById('txt1');
var txt = document.getElementById('txt2');
var but = document.getElementById('but');
but.onclick = function(){
ara.value += txt.value + '\n';
txt.value = '';
}
txt.onkeydown = function(ev){
var oev = ev || event;
if(oev.ctrlKey && oev.keyCode == 13){
but.onclick();
}
}
}
</script>