#javascript #html #jquery
#javascript #HTML #jquery
Вопрос:
Я хочу получить текст в пределах диапазона внутри элементов li. Я пытаюсь сделать это с помощью jquery.
<ul class="category-path breadcrumb">
<li><a href="/" title="/">Home</a></li>
<li ><a href="/saat" itemprop="url" title="Saat"><span itemprop="title">Watches</span></a></li>
<li><a href="/erkek-saatleri" itemprop="url" title="Erkek Saat"><span itemprop="title">man watches</span></a></li>
<li ><a href="" itemprop="url" title="NACAR"><span itemprop="title">NACAR</span></a></li>
</ul>
код, который я пробовал
$(".breadcrumb li").each(function (index) {
var bread = $(this "a span").text();
window.alert(bread index);
});
Комментарии:
1. Попробуйте
var bread = $(this).find("span").text();
2. Или вы можете сделать
$('a span', this).text()
Ответ №1:
Как указано в комментариях, вы можете использовать либо $(this).find("a span").text()
, либо $("a span", this).text()
. Кроме того, вы можете использовать :has(span)
для того, чтобы настроить таргетинг только на li
элементы, у которых есть span
элемент:
$(".breadcrumb li:has(span)").each(function(index) {
var bread = $("a span", this).text();
console.log(bread index);
var brd = $(this).find("a span").text();
console.log( brd );
});
Кроме того, вы можете получить весь текст в массиве следующим образом:
var loaves = $(".breadcrumb span").map((index, span) => `${span.textContent}${index}`).get();
console.log( loaves );
ДЕМОНСТРАЦИЯ
//One by one ... Use :has(span) to target only li elements with a span
$(".breadcrumb li:has(span)").each(function(index) {
var bread = $("a span", this).text();
console.log(bread index);
var brd = $(this).find("a span").text();
console.log( brd );
});
//All together in an array
var loaves = $(".breadcrumb span").map((index, span) => `${span.textContent}${index}`).get();
console.log( loaves );
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="category-path breadcrumb">
<li><a href="/" title="/">Home</a></li>
<li><a href="/saat" itemprop="url" title="Saat"><span itemprop="title">Watches</span></a></li>
<li><a href="/erkek-saatleri" itemprop="url" title="Erkek Saat"><span itemprop="title">man watches</span></a></li>
<li><a href="" itemprop="url" title="NACAR"><span itemprop="title">NACAR</span></a></li>
</ul>
Ответ №2:
Пожалуйста, попробуйте приведенный ниже код. Это поможет вам получить содержимое span в каждом элементе списка.
$(".breadcrumb li span").each(function () {
window.alert($(this).text());
});