CSDN认证C1等级考试——练习（四）

最新推荐文章于 2022-07-12 17:17:59 发布

肆〇

最新推荐文章于 2022-07-12 17:17:59 发布

阅读量192

点赞数 2

本文链接：https://blog.csdn.net/m0_51660523/article/details/116452799

版权

CSDN认证C1等级考试——练习（四）

任务⼀

能够⽤HTML + CSS + JavaScript在⻚⾯正中⽣成⼀幅⼴告图⽚；
⽤JavaScript数组在⻚⾯上放置多张⼴告图⽚，同时动态计算不同⼴告位之间的布局，实现⽔平等间距布局；
⽤JavaScript代码实现多张⼴告图⽚轮播效果：在⻚⾯正中每隔3秒切换不同的⼴告图⽚，多张图⽚轮流显示。

JavaScript的前世今生：

JavaScript是运行在浏览器上的脚本语言，简称js

js是网景公司（NetScape）的布兰登艾奇开发的，最初叫做LiveScript。

LiveScript的出现让浏览器更加生动了，不再是单纯的静态页面了，页面更具有交互性。

Vue和Angula的底层脚本语言都是JavaScript。

在历史的某个阶段，SUN公司和网景公司之间有合作关系，SUN公司把Livescript的名字修改为Javascript。Javascript这个名字中虽然带有"Java"但是和Java没有任何关系，只是语法上优点类似。他们运行的位置不同，Java运行在JVM当中，Javascript运行在浏览器的内存当中。
Javascript程序不需要我们程序员手动编译，编写完源代码之后，浏览器直接打开解释执行。Javascript的"目标程序"以普通文本形式保存，这种语言都叫做"脚本语言"。
Java的目标程序已.class形式存在，不能使用文本编辑器打开，不是脚本语言。网景公司1998年被美国在线收购。
网景公司最著名的就是领航者浏览器: Navigator浏览器。
Livescript的出现，最初的时候是为Navigator浏览器量身定制一门语言
不支持其他浏览器。
当Navigator浏览器使用非常广泛的时候，微软害怕了，于是微软在最短的时间内组建了一个团队，开始研发只支持IE浏览器的脚本语言，叫做Jscript.
Javascript和Jscript并存的年代，程序员是很痛苦的，因为程序员要写两套程序。在这种情况下，有一个非营利性组织站出来了，叫做ECMA组织（欧洲计算机协会）。

ECMA根据Javascript制定了ECMA-262号标准，叫做ECMA-script。现代的javascript和jscript都实现了ECMA-script规范。(javascript和jscript统一)

JSP和js的区别：

JSP : Javaserver Pages(隶属于Java语言的，运行在JM当中)

Js: Javascript(运行在浏览器上)

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>ZuiYangDan</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        #container {
            width: 99.5%;
            border: 1px solid #aaa;
            margin: 100px 0px;
        }

        #pictures {
            width: 99%;
            height: 320px;
            overflow: hidden;
            position: relative;
        }

        #ul1 {
            position: absolute;
            left: 0;
            top: 0;
            overflow: hidden;
        }

        #ul1 li {
            float: left;
            width: 700px;
            height: auto;
        }

        #ul1 li img {
            width: 700px;
            height: auto;
        }
    </style>
    <script>
        window.onload = function () {
            var oDiv = document.getElementById("pictures");
            var oUl = document.getElementById("ul1");
            var speed = -3;
            var oLi = document.getElementsByTagName("li");

            oUl.innerHTML += oUl.innerHTML;//先把图片增加一组
            oUl.style.width = oLi.length * oLi[0].offsetWidth + "px";

            function move() {
                if (oUl.offsetLeft < -oUl.offsetWidth / 2) {
                    oUl.style.left = "0";
                }
                oUl.style.left = oUl.offsetLeft + speed + "px";
            }
            var timer = setInterval(move, 30);
            oDiv.onmouseover = function () {
                clearInterval(timer);
            };
            oDiv.onmouseout = function () {
                timer = setInterval(move, 30);
            };
        }

    </script>
</head>

<body>
    <div id="container">
        <div id="pictures">
            <ul id="ul1">
                <li>
                    <img src="images/4.png" alt="">
                </li>
                <li>
                    <img src="images/5.png" alt="">
                </li>
                 <li>
                    <img src="images/6.png" alt="">
                </li>
                 <li>
                    <img src="images/7.png" alt="">
                </li>
            </ul>
        </div>
    </div>
</body>

</html>
————————————————
版权声明：本文为CSDN博主「dq_095」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/qq_37968920/article/details/82490732

参考文献：https://www.bilibili.com/video/BV1Ft411N7R3?from=search&seid=3486729659139445880

https://blog.csdn.net/qq_37968920/article/details/82490732?spm=1001.2014.3001.5501

肆〇

关注

2
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
CSDN认证C1等级考试——练习（四）

CSDN认证C1等级考试——练习（四）JavaScript是运行在浏览器上的脚本语言，简称jsjs是网景公司（NetScape）的布兰登艾奇开发的，最初叫做LiveScript。LiveScript的出现让浏览器更加生动了，不再是单纯的静态页面了，页面更具有交互性。在历史的某个阶段，SUN公司和网景公司他们之间有合作关系，SUN公司把LiveScript名字修改为JavaScript。...
复制链接

扫一扫