案例_自动跳转首页和DOM_概述


案例_自动跳转首页

倒计时读秒效果实现

  1.定义一个方法,获取span标签,效果span标签体内容,时间- –

  2.定义一个定时器,1秒执行一次该方法

在方法中如果时间<=0,则跳转到首页

<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>自动跳转</title>
    <style>
        p{
            text-align: center;
        }
        span{
            color: red;
        }
    </style>
</head>
<body>
    <p>
        <span id="time">5</span>秒之后,自动跳转到首页...
    </p>
<script>
    var second = 5;
    var time = document.getElementById("time");
    function showTime() {
        second--;
        if (second<=0){
            location.href = "https://www.baidu.com"
        }
        time.innerHTML = second+"";
    }
    setInterval(showTime,1000);
</script>
</body>
</html>

 

DOM_概述

概念:Document Object Model 文档对象模型 

DOM 是一项 W3C (World Wide Web Consortium) 标准。

DOM 定义了访问文档的标准:

W3C 文档对象模型(DOM)是中立于平台和语言的接口,它允许程序和脚本动态地访问、更新文档的内容、结构和样式。”

W3C DOM 标准被分为 3 个不同的部分:

  • 核心 DOM – 所有文档类型的标准模型
    • Document:文档对象
    • Element:元素对象
    • Attribute:属性对象
    • Text:文本对象
    • Comment:注释对象
  • XML DOM – XML 文档的标准模型
  • HTML DOM – HTML 文档的标准模型

 

会把你编写的HTML页面转换为DOM树

案例_自动跳转首页和DOM_概述

 

 

 

搜索

复制

原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/278715.html

(0)
上一篇 2022年8月3日
下一篇 2022年8月3日

相关推荐

发表回复

登录后才能评论