javascript - Javascript to get value of one item in a list of items in html code

Question

I have a list of items, which have inputs that are hidden but all contain different values, How do i get the value from each li

<ul class="happiness">
 <li><input type="hidden" value="guid-xxxx0"/> Happy </li>
 <li><input type="hidden" value="guid-xxxx1"/> Sad </li>
 <li><input type="hidden" value="guid-xxxx2"/> I dont know </li>
</ul>

Is this the right way to do it?

$(".happiness").click(function(){
 var value = $(this).find("li input").val();
});

Answer 1

将 click 事件绑定到以使用元素包含的值li更新内容。#displayer我假设在实践中<li>会有更多的内容。

例如：

Array.prototype.forEach.call(document.querySelectorAll('li'), function (elem) {
    elem.addEventListener('click', function () {
        document.getElementById('displayer').textContent =
            this.querySelector('input').value;
    });
});

这行得通，但它确实做了一些假设，例如每个li人只有一个input后代。