zoukankan      html  css  js  c++  java
  • (16)JavaScrip 之 DOM 基础

    ◇HTML页面是一边下载一边执行的。

    ◇如果需要在页面j全部加载完成后做一些事情,可以利用onload事件来执行。

    ◇如果需要在页面关闭后来做一些事情,可以利用onunload事件来执行。

    ◇如果需要在页面关闭之前来做一些事情,可以利用onbeforeunload事件来执行,可以用来提示用户是否要离开页面,可以用“window.event.returnValue”事件,例如:

    ◇动态的修改一个文本内容(DOM对象)的事件:

    <head>
        <script type="text/javascript">      
            function f1() {
                alert("f1函数");
            }      
        </script>
    </head>
    <body>
    <hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/><hr/>
    <input type="button" name="btn1" value="button" onclick="document.ondblclick=f1" />//本行最后的f1不必加括号“()”
    </body>

    注:再点击按钮后,会在document的对象的onclick里加上f1这个函数

    ◇可以用confirm()函数来让用户选择是否,返回值分别是true和false,如下代码:

    <script type="text/javascript">              
            function confrimtest() {
                if (confirm("是否进入")) {
                    alert("进入");
                }
                else {
                    alert("取消进入");
                }
            }      
    </script>

    注:上面的function就在一个按钮中触发这个事件即可.

    ◇setInterval方法,用来重新导向到另外一个网站上,例如:

     ◇setInterval()函数,作用是每隔一段时间执行一段代码,例子如下,已写成自定义函数,可以自己调用:

        <script type="text/javascript">              
            function startInterval() {
                setInterval("alert('运行setInsertval')",2000);
            }
        </script>

    ◇既然有setInterval,那就必然有clearInterval,清楚该定时器,代码

        <script type="text/javascript">              
            function startInterval() {
                setInterval("alert('运行setInsertval')",2000);
            }
            var interval = setInterval("alert('运行setInsertval')",2000);
            clearInterval(interval);
        </script>

    注:可以在一个按钮的onclick事件里来触发clearInterval(interval)。
    ◇另外,还有setTimeout,和clearTimeout,用法与setInterval和clearTimeout相同。不同的是,setInterval会执行多次,而setTimeout,只执行一次。

  • 相关阅读:
    PHP 使用 ElasticSearch
    PHP面试题目
    MySQL取得某一范围随机数
    Git版本控制的基本命令
    PHP中array_merge和array相加的区别分析
    nginx服务器常见错误代码500、501、502、503、504、505
    Laravel小项目之第4节 Laravel-通过表单实现新增及操作状态提示功能
    前端基础 jQuery
    前端基础 DOM & BOM
    前端基础 & 初识JS(JavaScript)
  • 原文地址:https://www.cnblogs.com/kaolalovemiaomiao/p/4794595.html
Copyright © 2011-2022 走看看