在javascript中查找位于用户单击上方的最近隐藏字段的值

我试图用javascript获取每个LI组上方的隐藏字段的值，我不能使用jQuery，因为一个不合理的客户担心（相信我，我已经尝试过了，他们只是不想“冒险”添加库）。。。无论如何

列表如下所示：

<input id="hidden1" type="hidden" value="5" class="includeds">
<h3>header</h3>
<ul class="groups">
    <li><input id="li1" type="checkbox" value="1" onclick="value()"></li>
    <li><input id="li2" type="checkbox" value="2" onclick="value()"></li>
    <li><input id="li3" type="checkbox" value="3" onclick="value()"></li>
</ul>
<input id="hidden2" type="hidden" value="3" class="includeds">
<h3>header2</h3>
<ul class="groups">
    <li><input id="li4" type="checkbox" value="4" onclick="value()"></li>
    <li><input id="li5" type="checkbox" value="5" onclick="value()"></li>
    <li><input id="li6" type="checkbox" value="6" onclick="value()"></li>
</ul>

---

但当我向客户介绍时，我遇到了上述投诉。所以现在我需要用javascript做同样的事情。我很感激你们能提供的任何帮助或建议。很抱歉在jquery和javascript之间问了两次同样的问题。

嗯，我会使用jquery代码：

$(this).parent().prev().prev().val()

记住这一点，您所要做的就是重写代码以更正普通javascript实体

结果是：

function getParent(node){
    return node.parentNode;
}

function getPrev(node){
    do { // loop to find the previous node that is an element
        node = node.previousSibling;
    }while(node && node.nodeType != 1);
    return node;
}

getPrev(getPrev(getParent(this))));

---

如果不能使用jQuery，那么像上面提到的那样复杂的查询将变得更加困难。在jQuery的liue中，最容易通过元素的

ID

标记或类过滤器（取决于场景）引用元素

在这里，我认为最好的办法是将给定的

input

ID硬编码到

onclick

函数中

HTML

---

问题的关键是他们不能再使用jQuery了，需要直接的Javascript，我的回答是，他不能使用jQuery并不意味着他不能思考jQuery:）

function getParent(node){
    return node.parentNode;
}

function getPrev(node){
    do { // loop to find the previous node that is an element
        node = node.previousSibling;
    }while(node && node.nodeType != 1);
    return node;
}

getPrev(getPrev(getParent(this))));

<input id="hidden2" type="hidden" value="3" class="includeds">
<h3>header2</h3>
<ul class="groups">
    <li><input id="li4" type="checkbox" value="4" onclick="value('hidden2')"></li>
    <li><input id="li5" type="checkbox" value="5" onclick="value('hidden2')"></li>
    <li><input id="li6" type="checkbox" value="6" onclick="value('hidden2')"></li>
</ul>

function value(id) {
  var elem = document.getElementByID(id);
  ...
}