Question

<p id="color" >This paragraph may change color </p>
<input type="button" value="Change color" onclick="change()">

<script type="text/javascript">
var colors=["red","blue","green","yellow"];
var changed=0;

function change(){
        document.getElementById('color').style.color=colors[changed]; 
        changed=changed+1;
    }
</script>

这会在点击时改变颜色，但当两个变量保留在函数内部时，它不起作用......有人可以向我解释为什么吗？

Answer 1

如果将这些变量放入函数中，它们将在函数启动时创建，并在完成后删除。所以，＆＃34;改变了＃34;永远是0。

Answer 2

＆＃13;

function change(){

    var colors=["red","blue","green","yellow"];
    var changed=0;
    console.log(changed);
    document.getElementById('color').style.color=colors[changed]; 
    changed=changed+1;
    console.log(changed);
}

＆＃13;

<p id="color" >This paragraph may change color </p>
<input type="button" value="Change color" onclick="change()">

＆＃13;

它会改变颜色但只改变一次，这是因为每次调用changed时change()都会初始化为0，所以每当它变为document.getElementById('color').style.color=colors[0]并且颜色变为红色但不会变为＆＃39 ; t再次改变..

Javascript代码在函数外部运行，但在函数内部运行时不运行

2 个答案: