javascript - 如何根据特定的按钮点击更改代码？

Question

有 2 个按钮 RED 和 BLUE。如果单击红色，则必须出现一些“示例代码”并移动到蓝色“示例代码必须隐藏并且必须出现“新段落”，反之亦然。

Answer 1

var red = document.getElementById('RED');
var blue = document.getELementById('BLUE');
var sampleCode = document.getElementById('SAMPLE');

red.addEventListener('click', function () {
    blue.style.display = 'none'; // hide blue, and you can use this method to hide every element you want
    sampleCode.style.display = 'block'; // display sampleCode element
};

Answer 2

您将添加 onClick 侦听器。您可以使用 JQuery 轻松完成这些工作。

就像是...

$.('#myRedbutton').click(function(){
  //Do the red button stuff.
};

$.('#myBluebutton').click(function(){
  //Do the blue button stuff.
};

对于纯 Javascript，您可以像这样编辑按钮的 HTML。

 <button onclick="redButton()">Red</button>

单击上面的按钮将调用redButton().