交通灯课程

编程入门行业动态更新时间:2024-10-26 10:35:42

本文介绍了交通灯课程 - A452的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！问题描述

第3部分我困惑了抓住html和js的基本概念，以便使用一个数组和一个按钮来创建一个交通灯。到目前为止，我成功地使css和所有资产显示为如此的形状和颜色。我想知道什么会帮助修复这个代码，因为我不知道什么问题。我研究的其他网站给了我一些完全不同的公共和东西。不知道。

HTML：

<！DOCTYPE HTML> < html> < head> < title>交通灯脚本< / title> <！ - 上述标签的名称 - > < link href =TrafficCascade.css =stylesheet> < / head> < body> < h1>交通灯< / h1>< / - > < table> <！ - - > < tr> < td> < button onClick =functionary（）> Switch< / button> < div id =redL>< / div> < div id =yellowL>< / div> < div id =greenL>< / div> < / td> < / tr> < / table> < script src =Trafficvarscript.js>< / script> < / body> < / html>

Css：

code> #redL { height：50px; width：50px; margin：1px auto; background-color：＃7A0000; border-radius：50px; border：solid 1px black; padding：1px; } #yellowL { height：50px; width：50px; margin：1px auto; background-color：＃7A5C00; border-radius：50px; border：solid 1px black; padding：1px; } #greenL { height：50px; width：50px; margin：1px auto; background-color：＃008000; border-radius：50px; border：solid 1px black; padding：1px; } table {/ *不需要破折号* / height：180px; width：80px; background-color：＃000000; border：1px＃000000; text-align：center; margin-left：50％; / *让margin margin 50％* / padding：1px; } h1 { text-align：center; padding：1px; }

Javascript：

第4部分

我必须使一个交通灯，运行没有任何输入所以自动，这带来了我在javascript中的onload函数运行脚本时加载页面。我想知道如何正确实现这在我目前的代码。我也希望交通灯循环通过具有时间延迟的颜色，这可以通过设置间隔。我努力正确地添加这两个功能，让它的工作。我重用了css，只改变了js和html。

解决方案

一切都按顺序显示，只在网页加载时调用一次。您需要在每次按下按钮时执行检查，因此将它们添加到 functionary 方法中，如下所示：

注意我修复了这个新的 updateLights 方法。

Part 3 I've been confused grasping the basic concepts of html and js inorder to make a traffic light with a array and a button. So far I successfully made the css and all assets appear so the shapes and colours. I was wondering what would help fix this code as im not sure whats the problem. Other sites i researched gave me something completely different like public and stuff. No idea. I use notepad and will have to put this in my coursework.

HTML:

<!DOCTYPE HTML> <html> <head> <title> Traffic Light Script </title>  <link href="TrafficCascade.css" rel="stylesheet"> </head> <body> <h1> Traffic Light </h1> <table>  <tr> <td> <button onClick="functionary()">Switch</button> <div id="redL"></div> <div id="yellowL"></div> <div id="greenL"></div> </td> </tr> </table> <script src="Trafficvarscript.js"></script> </body> </html>

Css:

#redL{ height: 50px; width: 50px; margin: 1px auto; background-color: #7A0000; border-radius: 50px; border: solid 1px black; padding: 1px; } #yellowL{ height: 50px; width: 50px; margin: 1px auto; background-color: #7A5C00; border-radius: 50px; border: solid 1px black; padding: 1px; } #greenL{ height: 50px; width: 50px; margin: 1px auto; background-color: #008000; border-radius: 50px; border: solid 1px black; padding: 1px; } table{ /* Doesn't need dashes */ height: 180px; width: 80px; background-color: #000000; border: 1px #000000; text-align: center; margin-left: 50%; /* makes margin right 50% */ padding: 1px; } h1{ text-align: center; padding: 1px; }

Javascript:

Part 4

So for my coursework I have to make a traffic light that runs without any input so automatically, which brought me to the onload function in javascript which runs scripts when a page is loaded. I was wondering how to correctly implement this in my current code. I would also like the traffic light to cycle through colours with a time delay, which can be done through set interval. I was struggling to correctly add both of these functions to let it work. I reused the css and only changed the js and html.

解决方案

Everything appears in order, but your JavaScript conditions that change the colors are only being called once on page load. You need to perform the checks every time the button is pressed, so add them to your functionary method, like so:

Note I fixed a few other issues in this new updateLights method.

更多推荐

交通灯课程

本文发布于:2023-10-30 11:32:24，感谢您对本站的认可！

本文链接:https://www.elefans.com/category/jswz/34/1542727.html