Dom 学习总结以及实例的使用介绍

1、   重新导航到指定的地址:navigate("https://www.jb51.net");

2、

(1、*setInterval每隔一段时间执行指定的代码,第一个参数为代码的字符串,第二个参数为间隔时间(单位毫秒),返回值为定时器的标识。如: 

setInterval("alert('hello')",5000);

*clearInterval取消setInterval的定时执行,相当于Timer中的Enabled=False。因为setInterval可以设定多个定时,所以clearInterval要指定清除那个定时器的标识,即setInterval的返回值。

var intervalld= setInterval("alert('hello')",5000);
clearInterval(intervalld);

(2、setTimeout也是定时执行,但是不像setInterval那样是定时执行,而是设定时间后只执行一次,clearTimeout也是清除定时。
       很好区分:Interval是定时;Timeout是超时之意。

var timeoutld=setTimeout("alert('hello')",2000);
(3、案例:实现标题栏走马灯的效果,也就是浏览器的标题文字每隔500ms向右滚动一下

复制代码 代码如下:


跑马灯效果
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
 <html>
     <head>
         <title>欢迎来到daomul的博客,欢迎再来,谢谢</title>
         <script type="text/javascript">
             function scroll() {
                 var title = document.title;
                 var first = title.charAt(0);
                 var last = title.substring(1, title.length);
                 document.title = last+first;
             }
             setInterval("scroll()",500);
          </script>
     </head>
     <body>

     </body>
 </html>


3、

(1、onload:网页加载完毕时触发,浏览器是一边下载文档、一边解析执行,可能会出现JavaScript执行时需要操作某个元素,这个元素还没有加载,如果这样就要把操作的代码放到body的onload事件中,或者可以把JavaScript放到元素之后。元素的onload事件是元素自己加载完毕时触发,而body 里的onload才是全部加载完成。
   (2、onunload:网页关闭(或者离开)后触发。onbeforeunload:窗口离开(比如前进、后退、关闭之前)就会弹出确认消息。如:                                                     <body onbeforeunload="Window.event.returnValue='真的要放弃发贴退出吗?'">

4、

除了有特有的属性之外,当然还有通用的HTML元素的事件:onclick(单击)、ondblclick(双击)、onkeydown(按键按下)、onkeyup(按键释放)、onkeypress(点击按键)、onmousedown(鼠标按下)、onmousemove(鼠标移动)、onmouseout(鼠标离开元素范围)、
onmouseover(鼠标移动到元素范围)、onmouseup(鼠标按键释放)等。

5、window对象的属性

(1、window.location.href="http://www.sina.com.cn",重新导向新的地址,和navigate方法效果一样。window.location.reload()刷新页面。
(2、window.event是非常重要的属性,用来获得发生事件时的信息,事件不局限于window对象的事件,所有元素的事件都可以通过event属性取到相关信息。
         a、altKey属性,boot类型,表示发生事件时alt键是否被按下,类似的还有ctrlKey、shiftKey属性

复制代码 代码如下:


windows事件样例
 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml">
 <head>
     <title></title>
 </head>
 <body>
     <input type="button" value="href" />
     <input type="button" value="重定向" />
     <input type="button" value="点击" /><a
         href="https://www.baidu.com"></a>
     <form action="daomul.aspx">
     <input type="submit" value="提交" />
     </form>
 </body>
 </html>


 

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wdgfxj.html