外部.js仅运行部分代码

external .js only runs some parts of code

本文关键字：代码 运行部 js 外部      更新时间：2023-09-26

>我正在尝试学习Javascript，并且在使用外部.js文件时遇到问题。 我正在尝试制作一个在选择不同单选按钮时改变颜色的div。 我已经使用"onclick"属性和 js 函数让它工作。 不过，我无法使用 javascript 让div 默认为颜色。 这是我正在使用的代码：

<!DOCTYPE html>
<html>
<head>
    <script type="text/javascript" src="jspract_j.js"></script>
</head>
<body>
    <form name="form" action="jspract.html" method="post">
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="red" value="red">Red</label><br>
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="yellow" value="yellow">Yellow</label><br>
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="blue" value="blue">Blue</label><br>
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="orange" value="orange">Orange</label><br>
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="purple" value="purple">Purple</label><br>
        <label><input type="radio" onclick="javascript:divcol(this.value);" name="color" id="green" value="green">Green</label><br>
        <br>
    </form>
    <div id="change"></div>
    </body>

还有Javascript：

function divcol(color)
{
    document.getElementById("change").style.backgroundColor=color;
}
document.getElementById("change").style.backgroundColor="pink";

单选按钮更改颜色，按预期工作。div 在加载时显示为白色，但不是粉红色。 这里出了什么问题？

我觉得我错过了Javascript工作的一些关键部分。 我尝试过搜索互联网，但我发现的只是关于人们错误地链接.js文件的帖子。 我的链接正确，但没有按照我想要的方式执行。

您正在尝试在加载dom之前设置颜色。下面是完美运行的代码。将脚本放在正文标签关闭之前

http://jsbin.com/UkUGeJu/1/

在加载时，颜色是粉红色的，当您更改相应的颜色时，相应的颜色会更新。

相关文章：