Javascript 单击按钮后设置"；显示：无“；

单击标记上方的“显示/隐藏”按钮时，效果良好。但是对于下面的按钮（前满），它不会隐藏标签的内容。如果我将按钮移到开始标记上方，它将工作。如何使其链接到其上方的隐藏标记

<input type="button" onclick="show(this);" value="show"/>
<input type="button" onclick="hide(this);" value="hide"/>

<hide class="inner" style="display.none;">
<input type="button" onclick="showSpoiler1(this);" value="Front flip variaion (ramp)" />
<input type="button" onclick="showSpoiler2(this);" value="Front flip variaion (flat)" />
<input type="button" onclick="showSpoiler3(this);" value="Backflip variations" />
<input type="button" onclick="showSpoiler4(this);" value="Sideflip Variations (ramp)" />
<input type="button" onclick="showSpoiler5(this);" value="Twists and other tricks" />

<div1 class="inner" style="display:none;">
    <ul>
        <input type="button" onclick="hide(this);" value="Front full"/>
        <li>Double Front</li>
        <li>Aerial Twist</li>
    </ul>
</div1>
</hide>

---

您不能为这两个按钮使用相同的

hide（）

函数，因为它所做的事情对于隐藏的内容非常具体。你为什么不试试这样的方法呢：

function hideParent(obj)
    {
    var inner = obj.parentNode.parentNode;
        inner.style.display = "none";
    }


<hide class="inner" style="display.none;">
...
<div1 class="inner" style="display:none;"> // <- assuming this is what this supposed to nbe hidden
    <ul>
        <input type="button" onclick="hideParent(this);" value="Front full"/>
        <li>Double Front</li>
        <li>Aerial Twist</li>
    </ul>
</div1>
</hide>

---

像其他评论建议的那样，不要使用

只需使用

然后使用getElementById

您的

隐藏
和
显示
函数查找按钮父项的子项，即按钮的兄弟项。按钮的父级是div，div的父级是hide

如果希望按钮影响包含它的隐藏元素，请尝试
hide（this.parentNode.parentNode）

或者，您可以更改hide/show函数，使其在DOM层次结构中逐步迭代到更高的位置，直到找到隐藏元素为止，这样它将适用于同级、父级和父级的同级。也许是这样的：

function hide(obj)
  {
   if (obj !== document)
   {
     var parent = obj.parentNode;
     var inner = parent.getElementsByTagName("hide");
     if (inner.length > 0) 
     {
       inner[0].style.disply = "none";
     } else {
       hide(parent)
     }
   } 
  }

在下面的按钮中，您有：

<div1 class="inner" style="display:none;">
    <ul>
        <input type="button" onclick="hide(this);" value="Front full"/>
        <li>Double Front</li>

因此，当您单击按钮时，obj是对按钮的引用。它的父节点将是一个LI，该LI将通过纠错插入（因为按钮不能是UL元素的子节点）。该父节点没有子“隐藏”元素

即使按钮是UL的子项，它也没有任何隐藏子项。考虑一下：

var inner = document.getElementsByTagName("hide")[0];

请注意，从浏览器兼容性的角度来看，键入
和编写自己的元素通常是一个坏主意。您是否在关注更简单的JS answer或jquery
<div1 class="inner" style="display:none;">
    <ul>
        <input type="button" onclick="hide(this);" value="Front full"/>
        <li>Double Front</li>

function show(obj)
    {
    var inner = obj.parentNode.getElementsByTagName("hide")[0];

var inner = document.getElementsByTagName("hide")[0];