javascript 访问在js文件中创建的innerHtml中的类名

9rnv2umw 于 2023-02-07 发布在 Java

关注(0)|答案(1)|浏览(134)

我目前正在创建一个本地存储的购物车，当我在购物车页面中一个接一个地添加我的产品时，我使用innerHtml：

productsContainer.innerHTML += `
            <div class="cart-product">
            <img src="../images/${item.tag}" alt="image product" style="height: 120px;">
            <div class="product-info-container">
                <div class="product-cross"><i class="bi bi-x"></i></div>
                <div class="product-info">
                <h4 class="product-title">${item.name}</h4>
                <h5 class="price">${item.inCart * item.price} €</h5>
                <div class="product-info-number">
                    <i class="bi bi-dash" id="bi-dash"></i>
                    <span class="quantity">${item.inCart}</span>
                    <i class="bi bi-plus" id="bi-plus"></i>
                </div>
                </div>
            </div>
        </div>
            `

我现在的问题是我想访问我的两个图标（i class=“bi-dash / i class=“bi-plus”）来增加和减少数量。我试图用querySelctore和getElementById将它们存储在变量中，但它不起作用。我得到了一个空错误。

JavaScript

来源：https://stackoverflow.com/questions/75365167/accessing-class-name-in-a-innerhtml-made-in-js-file

1条答案

按热度按时间

9jyewag01#

看起来工作正常。
下面的代码片段显示了在控制台中记录的元素：

<html>
<body>
    <div id="test"></div>

<script>
    let testElement = document.getElementById("test");
    testElement.innerHTML += `
        <i class="bi bi-dash" id="bi-dash">bi-dash</i>
        <i class="bi bi-plus" id="bi-plus">bi-plus</i>
    `;
    let biDash = document.getElementById("bi-dash");
    let biPlus = document.getElementById("bi-plus");
    
    console.log(test, biDash, biPlus);
</script>

</body>
</html>

赞(0）回复(0）举报 2023-02-07

我来回答

javascript 访问在js文件中创建的innerHtml中的类名

1条答案

相关问题

热门标签

最新问答