单击按钮时如何显示“tr”标签内容？答案

【问题标题】：How can I show a "tr" tags content when I click a button?单击按钮时如何显示“tr”标签内容？
【发布时间】：2019-03-24 12:50:03
【问题描述】：

我正在创建一个 chrome 应用程序，我需要在单击按钮时显示表格的一部分。

我查看了各种答案，但是当我单击按钮时，我不断收到来自 chrom 的错误/

这是我的 JavaScript：

    document.getElementById("newpull").style.visibility = "visible";
}
);
window.onload = function () {
        document.getElementById("newpull").style.visibility = "hidden";
};

还有我的 HTML：

 <button id="click" style="float; left">Click</button>


<tr class="red" id="newpull">
                <td></td>
                <td></td>
                <td></td>
                <td></td>
                <td></td>
            </tr>

【问题讨论】：

您应该重现问题中描述的问题，minimal reproducible example。

标签： javascript html css google-chrome-app

【解决方案1】：

按钮点击时显示块和无

function myFunc() {
  var disp = document.getElementById("newpull").style.display;
  console.log(disp);
  if (disp == 'block') {
    document.getElementById("newpull").style.display = 'none'
  } else {
    document.getElementById("newpull").style.display = 'block'
  }
}

<button id="click" style="float; left" onclick="myFunc()">Click</button>
<table>
  <tr id="newpull" style="display:none">
    <td>abc</td>
    <td>abc</td>
    <td>abc</td>
    <td>abc</td>
    <td>abc</td>
  </tr>
</table>

【讨论】：

【解决方案2】：

只需将函数放入脚本中，然后使用将onclick="showTR()" 放入<button> 按钮点击触发

<button id="click" style="float: left" onclick="showTR()">Click</button>

<table>
    <tr class="red" id="newpull">
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
    </tr>
</table>

这是你的脚本


function showTR(){
   document.getElementById("newpull").style.visibility = "visible";
}
window.onload = function () {
   document.getElementById("newpull").style.visibility = "hidden";
};

或者你也可以这样使用

function showTR(){
var status = document.getElementById("newpull").style.visibility ;
  if (status == 'visible') {
     document.getElementById("newpull").style.visibility = "hidden";
  } else {
     document.getElementById("newpull").style.visibility = "visible";
  }
}
window.onload = function () {
   document.getElementById("newpull").style.visibility = "hidden";
};

【讨论】：