（HTML，CSS，JavaScript）的进阶运用

最新推荐文章于 2024-08-27 14:29:58 发布

学JAVA的秀琴

最新推荐文章于 2024-08-27 14:29:58 发布

阅读量843

点赞数 2

文章标签： css html javascript

本文链接：https://blog.csdn.net/m0_59619191/article/details/123270142

版权

HTML

概念:是最基础的网页开发语言，Hyper Text Markup Language超文本标记语言

书写规范：

代码演示：

CSS

概念： Cascading Style Sheets 层叠样式表(多个样式可以作用在同一个html的元素上，同时生效)。

与HTML结合：

JavaScript

使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象，与Web客户交互作用。例如可以设置鼠标悬停效果，在客户端验证表单，创建定制的HTML页面，显示警告框，设置cookie等等。

代码演示：

<!DOCTYPE html>
<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>
        /*
            分析：
               1.显示页面效果  <p>
               2.倒计时读秒效果实现
                   2.1 定义一个方法，获取span标签，修改span标签体内容，时间--
                   2.2 定义一个定时器，1秒执行一次该方法
               3.在方法中判断时间如果<= 0 ，则跳转到首页

         */
       // 2.倒计时读秒效果实现

        var second = 5;
        var time = document.getElementById("time");

        //定义一个方法，获取span标签，修改span标签体内容，时间--
        function showTime(){
            second -- ;
            //判断时间如果<= 0 ，则跳转到首页
            if(second <= 0){
                //跳转到首页
                location.href = "https://www.baidu.com";
            }

            time.innerHTML = second +"";
        }


        //设置定时器，1秒执行一次该方法
        setInterval(showTime,1000);



    </script>
</body>
</html>

总结：

html是标记语言，主要是用于建立网页的骨架，是结构层，可以理解成建房子的钢筋水泥
CSS 主要是设置html骨架元素的样式，比如位置、颜色等等，是表现层，可以理解成装修房子，粉刷什么的；
javascript是编程语言，用于实现网页的功能，完成一些交互等等，属于行为层，可以理解成安装房门、空调等等

学JAVA的秀琴

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
2
评论
（HTML，CSS，JavaScript）的进阶运用

HTML概念:是最基础的网页开发语言，Hyper Text Markup Language超文本标记语言书写规范：代码演示：CSS概念： Cascading Style Sheets 层叠样式表(多个样式可以作用在同一个html的元素上，同时生效)。与HTML结合：JavaScript使用它的目的是与HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象，与Web客户交互作用。例如可以设置鼠标悬停效果，在客...
复制链接

扫一扫