0

我目前正在尝试隐藏页面上可见的按钮,同时显示另一个自动隐藏的按钮(两者都在页面上,我没有添加新按钮,只是更改可见性)。

这就是它现在的样子:

<div class="myAwesomeButtons">
     <button id="first_button" class="blue_button inset_button" style="">First</button>
     <button id="second_button" class="green_button inset_button" style="display: none;">Second</button> 
     <button id="third_button" class="other_button">Third</button>
</div>

我正在尝试删除第一个按钮,并删除style第二个按钮上的属性。如何在 Chrome 扩展程序中使用 JavaScript 来实现这一点?

我已经按顺序整理了 manifest.json 文件,但我不确定如何处理其余部分。

这是我尝试过的,但我不确定我做错了什么:

function fixButtons() {
    document.getElementsByClassName("myAwesomeButtons")[0].style.visibility='hidden';
    document.getElementsByClassName("myAwesomeButtons")[1].style.visibility='visible';
}

fixButtons();
4

2 回答 2

0

You are mixing up the display and visibility properties.

I avoid using getElementsByClass when possible since it doesn't work with IE. I know this is a Chrome extension though, so it would work. However, since each button already has an ID, I would just use getElementById.

Try

function fixButtons() {
    var button1 = document.getElementById("first_button");
    button1.style.display= "none";
    var button2 = document.getElementById("second_button");
    button2.style.display= "inline";
}
于 2013-07-10T18:56:33.487 回答
0
function fixButtons() {
  var buttonGroup = document.getElementsByClassName("myAwesomeButtons")[0].getElementsByTagName("button");
  buttonGroup[0].style.visibility='hidden';
  buttonGroup[1].style.visibility='visible';
}
于 2013-07-10T18:42:24.350 回答