Question

这只是一个简单的javascript代码，用于更改显示或背景，或者只是为了查看是否可以使用javascript更改css属性。

这是基于一个例子。

但由于某种原因，我无法使用我自己定义的js函数来更改属性。

HTML代码

<div id="question"> testting javascript</div>
<button onclick="close()">Close</button>

JS代码

function close(){
    document.getElementById("question").style.display = "none";
    document.getElementById('question').style.backgroundColor = "#f3f3f3";
}

The JSfiddle

完整代码

<div id="question"> testting javascript</div>
<button onclick="close()">Close</button>
<script>
function close(){
    document.getElementById("question").style.display = "none";
    document.getElementById('question').style.backgroundColor = "#f3f3f3";
}
</script>

Answer 1

可能无法工作，原因有两个：

默认情况下，JSFiddle会将所有JavaScript代码包装在匿名函数中，因此您的close()函数永远不会暴露给主范围。
您选择名称close，这是用于关闭窗口的现有JavaScript方法：window.close。

以下代码正常运作：

＆＃13;

window.closeQuestion = function() {
  document.getElementById("question").style.display = "none";
  document.getElementById('question').style.backgroundColor = "#f3f3f3";
};

/*/ This is a way of having a full control over your JavaScript functions and events: /*/
document.getElementById('closeBtn').addEventListener('click', function() {
  closeQuestion();
});

＆＃13;

#question {
  background : red;
}

＆＃13;

<div id="question"> testting javascript</div>

<!-- This is lame: -->
<button onclick="closeQuestion()">Close</button>

<!-- This is better: -->
<button id="closeBtn">Close (better)</button>

＆＃13;

无论如何，您应该使用JavaScript处理事件。使用on*属性上个世纪。请参阅addEventListener。

无法通过javascript函数更改css属性

1 个答案: