将元素值推送到对象数组

提问者：小点点

将元素值推送到对象数组

我试图将一个元素的值推入到一个对象数组中，但是我所做的只是返回所有其他元素的第一个元素内部Html。我正在处理的代码附上。实际上我应该得到每一个元素。所有的参赛者都是这样的。然后我应该能够推到上面的空物体，以持有所有参赛者的分数出固定值。如显示对象={contestant_one:5，。。。}

null

var total = document.querySelector(".Fixed_number");
var minusBtn = document.querySelectorAll("#minus");
var plusBtn = document.querySelectorAll("#plus");
var GetTotal = document.getElementById('get_all');

var value1 = document.getElementById('Contestant_One');
var value2 = document.getElementById('Contestant_Two');
var value3 = document.getElementById('Contestant_Three');
var value4 = document.getElementById('Contestant_Four');

plusBtn.forEach(function(item) {
    item.onclick = function() {
        if (parseInt(total.innerText) > 0) {
            item.nextElementSibling.innerText = parseInt(item.nextElementSibling.innerText) + 1;
            total.innerText = parseInt(total.innerText) - 1;


            if (parseInt(total.innerText) == 0) {


                const countries = document.querySelectorAll('.country');

                const result = [];

                for (const country of countries) {
                    let resEl = {};

                    [...country.querySelectorAll('span[class^="Contestant-"]')].forEach((span) => resEl[span.className.split('-')[1]] = value1.innerHTML)
                    result.push(resEl);
                }

                console.log(result)


            }
        }
    };
});

minusBtn.forEach(function(item) {
    item.onclick = function() {
        if (parseInt(item.previousElementSibling.innerText) > 0) {
            item.previousElementSibling.innerText = parseInt(item.previousElementSibling.innerText) - 1;
            total.innerText = parseInt(total.innerText) + 1;
        }
    };
});



/*My Console.log(result) output suppose to be something like

0: {one: "3"}
1: {two: "2"}
2: {three: "2"}
3: {four: "6"}
length: 4



but it's only using the first value for other objects so it's returning something like

0: {one: "9"}
1: {two: "9"}
2: {three: "9"}
3: {four: "9"}
length: 4

*/

<body>
    <div class="Fixed_number">10</div>
    <ul class="countries">

        <form>
            <label for=""> Contestant_One
        <div id="" class="country">
            <button id="plus"   type="button">+</button>
            <span id="Contestant_One" class="Contestant-one">0</span>
            <button id="minus"  type="button">-</button>
        </div>
        </label>
        </form>




        <form>
            <label for=""> Contestant_Two
        <div id="" class="country">
            <button id="plus" type="button">+</button>
            <span id="Contestant_Two" class="Contestant-two">0</span>
            <button id="minus" type="button">-</button>
        </div>
        </label>
        </form>


        <form>
            <label for="" class="country"> Contestant_Three
        <div id="">
            <button id="plus" type="button">+</button>
            <span id="Contestant_Three" class="Contestant-three">0</span>
            <button id="minus" type="button">-</button>
        </div>
        </label>
        </form>




        <form>
            <label for="">Contestant_Four
        <div id="" class="country">
            <button id="plus" type="button">+</button>
            <span id="Contestant_Four" class="Contestant-four">0</span>
            <button id="minus" type="button">-</button>
        </div>
        </label>
        </form>
    </ul>


    <div id="all_total">
        <button id="get_all" type="submit">Get Totals</button>
    </div>






    <script type="text/javascript" src="app.js"></script>


</body>

null

共2个答案

匿名用户

[...Country.QuerySelectorAll('span[class^=“contestant-”]')].foreach((span)=>resel[span.classname.split('-')[1]]=value1.innerHTML)

您硬编码了value1，它应该是动态的，如:

[...Country.QuerySelectorAll('span[class^=“contestant-”]')].foreach((span)=>resel[span.classname.split('-')[1]]=document.GetElementById（span.id）。innerHTML)

匿名用户

您的错误出现在这行代码[...Country.QuerySelectorAll('span[class^=“contestant-”]')].foreach((span)=>resel[span.classname.split('-')[1]]=value1.innerHTML)中

将value1.innerHTML添加到forEach循环中每个元素的结果数组中。