javascript的DOM编程
◆DOM编程
1.
为什么要学习DOM编程
通过这种交互操作,可以编写各种网页游戏,乌龟抓鸡,贪吃蛇,推箱子,坦克大战。
2.dom编程,也是学习ajax技术的基础,所以要掌握好dom编程
◆dom编程简介
DOM=Document Object Model(文档对象模型)【可以理解为把html文档当作对象来进行编程的模型】
关系图:
DOM编程,把html文件看作一颗DOM树,按照元素依次列下去,如下图:
再把这些元素当作对象,把他们当作对象之后,就可以对这些元素进行动态的控制,增加减少,修改删除都可以了。
◆bom
bom (browser object model)浏览器对象模型
因为做浏览器的厂家很多,w3c定义了一个做浏览器的规范,规定:
◆dom对象介绍
◆window对象
1.confirm
案例:
window.confirm("确定要删除吗?");
function test(){
var res=window.confirm("确定要删除吗?");
if(res){
window.alert("删除");
}else {
window.alert("放弃删除");
}
}
2.setInterval()
按照指定的周期(以毫秒计)来循环调用函数或计算表达式
案例1:简单的时钟
function showTime(){
//document.writeln(new Date());
//在元素间的文本就是通过 对象.innerText
document.getElementById("mytime").innerText=new Date().toLocaleString();
}
setInterval("showTime()",1000);
案例2:这里暂时有点问题。
图片滚动播放,可以通过这个做简单的动画效果
代码:
var n=1;
function run(){
//得到img对象
var myimg=document.getElementById("myimg");
//这里通过((n++%2)+1)的算法得到1,2,1,2循环的数,得意让图片按照文件名的顺序进行播放
//故而,想要得到从1到m循环的整数,可以用算法((n++%2)+1)来实现,要注意这里的循环是从2开始的。如,若m是4,则为:23412341234.....
myimg.src=((n++%2)+1)+".jpg";
}
setInterval("run()",800);
