函数没有按预期显示和更新 DOM 元素

问题描述 投票:0回答:0

在构建一个简单的银行应用程序作为 DOM 操作示例的过程中,我遇到了一个问题,我的非常简单的函数不会更新 HTML 片段,因此更新的值不会显示在屏幕应用程序上。这是我的函数和 HTML 片段。认为没有必要提供 CSS 代码,因为那里的问题没有任何意义。

来自 Java 脚本的代码(实际功能):

const labelSumIn = document.querySelector('.summary__value--in');
const labelSumOut = document.querySelector('.summary__value--out'); //elements defined at the top of code

calcDisplaySummary = function (movements) {
    const incomes = movements.filter(mov => mov > 0).reduce((ak, cur) => ak + cur, 0);
    labelSumIn.textContent = `${incomes}€`;
    const out = movements.filter(mov => mov < 0).reduce((ak, cur) => ak + cur, 0);
    labelSumOut.textContent = `${out}€`;
};

calcDisplaySummary([1,-1,2,-3]); //function call`
SUMMARY -->
<div class="summary">
    <p class="summary__label">In</p>
    <p class="summary__value summary__value--in">0000€</p>
    <p class="summary__label">Out</p>
    <p class="summary__value summary__value--out">0000€</p>
    <p class="summary__label">Interest</p>
    <p class="summary__value summary__value--interest">0000€</p>
    <button class="btn--sort">&downarrow; SORT</button>
</div>

javascript html function dom
© www.soinside.com 2019 - 2024. All rights reserved.