Можете ли вы посчитать элементы по имени изображения, используя length () в jQuery?

0

Я пытаюсь собрать обзорную "сводную" секцию, в которой содержится число 5-звездочных, 4-звездочных, 3-х звездных обзоров и т.д. Что мне нужно сделать, так это подсчет экземпляров каждого "уровня обзора" на странице продукта и выведите номер. Например, если у продукта есть 50 обзоров и 14 из них - 5 звезд, мне нужно вывести эту цифру на страницу как "14".

Единственный различие между отзывами - это не идентификатор или класс, а имя изображения, которое он выводит (это число звезд). Ниже приведены названия файлов изображений, для которых я имею в виду:

<ol class="ProductReviewList">
                <li class="">
        <h4 class="ReviewTitle">
            Cool hammock!
            <img src="http://cdn2.bigcommerce.com/rc71b9995f4a706510d16ad47d2472c26eb88e9bf/themes/HealthBeauty/images/IcoRating4.png" alt="">
        </h4>
        <p class="Meta">
            Posted by Matina Keller on 6th Jan 2014
        </p>
        <p>I love this hammock! I got the single brazilian for my courtyard out the side and it fits snug between two patio posts. I can easily put it up and take it down whenever i want. It really comfortable and easy to fall asleep in. The material is of very high quality and far better than my old hammock. Delivery was about 4 days to adelaide FYI.</p>
        <hr>
    </li>   <li class="Alt">
        <h4 class="ReviewTitle">
            So comfortable!
            <img src="http://cdn2.bigcommerce.com/rc71b9995f4a706510d16ad47d2472c26eb88e9bf/themes/HealthBeauty/images/IcoRating5.png" alt="">
        </h4>
        <p class="Meta">
            Posted by Kendra Lovell on 17th Dec 2013
        </p>
        <p>I bought one of these for my daughter and she loves it. It really comfortable and the colours are so pretty. Thanks siesta hammocks.</p>
        <hr>
    </li>   <li class="">
        <h4 class="ReviewTitle">
            Great customer service and product!
            <img src="http://cdn2.bigcommerce.com/rc71b9995f4a706510d16ad47d2472c26eb88e9bf/themes/HealthBeauty/images/IcoRating5.png" alt="">
        </h4>
        <p class="Meta">
            Posted by Susan Knight on 20th Nov 2013
        </p>
        <p>I must have had a million questions about this but the staff on the online chat answered all of them! Really good customer service and ordering system. The hammock itself is really good quality. So relaxing in the afternoon sun. Got the double hook kits and put it up between some wooden posts we already had under our pergola. Got the frame too in case we want to put it somewhere else. Really easy to assemble and is very sturdy. All up it been a great experience shopping with siesta so thanks.</p>
        <hr>
    </li>
        </ol>

Посмотрите в самом конце, как изображения либо IcoRating4.png, либо IcoRating5.png

Я хочу знать, могу ли я использовать.length() для подсчета элементов в документе не по идентификатору или классу, а по строке в имени своего файла или по имени изображения или некоторому варианту. Это возможно?

Я собрал здесь скрипку, если это поможет

Благодарю!

  • 2
    Похоже, что-то, что должно быть сделано в вашем бэкэнде до подачи в интерфейс, что, если бы вы начали разбивать свои обзоры на несколько страниц?
  • 0
    Это был мой следующий вопрос. Это немного сложно из-за того, что это платформа для электронной коммерции, которая ограничена в наших возможностях. Можно ли затем считать элементы на другом URL, кроме той страницы, на которой он находится? Как и в случае, когда начинается пагинация, он в основном создает новый URL с добавлением / reviews / pg2 в конце URL или чего-то еще. Или мы можем только считать элементы в текущем документе?

1 ответ

3
Лучший ответ

Конечно, может:

var count = $('img[src$="IcoRating4.png"]').length;

ref: http://api.jquery.com/attribute-ends-with-selector/

  • 0
    Спасибо, приятель, сейчас попробую.
  • 0
    Только что попробовал и нет выхода? Я делаю что-то не так на стороне дополнения? - jsfiddle.net/hLkhg/1
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню