javascript 我想根据从用户处收到的计数多次添加单个图像

k10s72fa 于 2023-01-19 发布在 Java

关注(0)|答案(2)|浏览(98)

我想多次添加单个图像，计数我将从用户那里获得。我想添加这个图像在特定的类，这将是在光滑的滑块卡。
我尝试过JavaScript，通过for循环显示图像，但它只在一张卡中可见，所有卡的图像数量都不同
超文本：

<div class="testimonialCarousel">
                <div class="item">
                    <div class="testimonialCard">
                        <div class="ratingStar"></div>
                        <div class="testimonialContent">
                            <p class="testimonailText">Lorem ipsum dolor sit amet consectetur. Augue orci sem nisi arcu sed faucibus fermentum. Ipsum sed morbi dapibus libero id massa fermentum id lorem justo.</p>
                            <p class="authorName">Ajit Babaleshwar</p>
                        </div>       
                    </div>
                </div>
                <div class="item">
                    <div class="testimonialCard">
                        <div class="ratingStar"></div>
                        <div class="testimonialContent">
                            <p class="testimonailText">Lorem ipsum dolor sit amet consectetur. Eu egestas non etiam netus velit vitae non tortor at. Viverra tempus nunc eget aliquam. Cursus sit elementum bibendum in duis amet in. Pulvinar turpis purus nunc nunc tellus. Suscipit pellentesque neque faucibus urna cursus.</p>
                            <p class="authorName">Nahia Colunga</p>
                        </div>       
                    </div>
                </div>
                <div class="item">
                    <div class="testimonialCard">
                        <div class="ratingStar"></div>
                        <div class="testimonialContent">
                            <p class="testimonailText">Lorem ipsum dolor sit amet consectetur. Eget dictumst est neque suspendisse arcu ullamcorper. Nascetur faucibus faucibus habitant auctor. Dui tortor nullam aliquam et. Amet et consectetur gravida sed ullamcorper dui odio. Sit natoque fusce egestas amet etiam cras.</p>
                            <p class="authorName">Ajit Babaleshwar</p>
                        </div>       
                    </div>
                </div>
                <div class="item">
                    <div class="testimonialCard">
                        <div class="ratingStar"></div>
                        <div class="testimonialContent">
                            <p class="testimonailText">Lorem ipsum dolor sit amet consectetur. Augue orci sem nisi arcu sed faucibus fermentum. Ipsum sed morbi dapibus libero id massa fermentum id lorem justo.</p>
                            <p class="authorName">Ajit Babaleshwar</p>
                        </div>       
                    </div>
                </div>
            </div>

JS系统

var numberOfRating = 5;
    var theLeftSide = document.querySelectorAll(".ratingStar");
    ratingsRow()
    function ratingsRow() {
      for(i = 0; i < numberOfRating; i++) {
        var stars = document.createElement("img");
        stars.src = "assets/images/rating.png";
        theLeftSide[0].appendChild(stars);
     }

   }

JavaScript

来源：https://stackoverflow.com/questions/75145810/i-want-to-add-single-image-multiple-times-as-per-count-received-from-user

2条答案

按热度按时间

2nc8po8w1#

如果我明白你的意思，这个密码可能有用。
使用@CBroe指定的两个循环，一个用于遍历类“ratingStar”的每个DIV，另一个用于插入图像

var numberOfRating = 5;

// For each Element with class "ratingStar"
$('.ratingStar').each(function(index){
    

    // For each Rating
    for(i=0;i<numberOfRating;i++)
    {
        // Create Image
        var stars = document.createElement("img");
        stars.src = "rating.png";

        // Append Image
        $(this).append(stars);
    }
    // End - For each Rating

});
// End - each Element with class "ratingStar"

赞(0）回复(0）举报 2023-01-19

y0u0uwnf2#

@juan更新了上面的代码，下面的代码对我很有效，

var cardDivs = document.getElementsByClassName('testimonialCard');

        for (var i=0; i<cardDivs.length; i++) {

            //Below logic is for getting count from card
            var selectedDiv = cardDivs[i];
            var val = selectedDiv.getElementsByClassName('starsToShow')[0].value;
            var starCount = parseInt(val);
            
            //appending star logic below

            let starElement = selectedDiv.getElementsByClassName('ratingStar')[0];
            for(let j = 0; j < starCount; j++){
                var stars = document.createElement("img");
            stars.src = "rating.png";
                starElement.append(stars);
            }
        }

赞(0）回复(0）举报 2023-01-19

我来回答

javascript 我想根据从用户处收到的计数多次添加单个图像

2条答案

相关问题

热门标签

最新问答