как подстроку 5 символов каждого тега p в массиве?

Question

как подстроку 5 символов каждого тега p в массиве?

1

У меня есть массив p тегов, и я хочу substring(0,5) для каждого p тега в массиве и заменить предыдущие. Но мой код работает некорректно.

HTML:

<div class="test1">
     <p class="cls">1.Im try to use the click function </p>
     <p class="cls">2.Im try to use the click function </p>
     <p class="cls">3.Im try to use the click function </p>
</div>

JS:

$(document).ready(function () {
     $('.cls').each(function () {
         var iTotalWords = $(this).text().split(' ');
         for (i = 0 ; i < iTotalWords.length; i++) {
             var result = iTotalWords.substring(0, 50);
             $(".cls").html(result);
         }
     });
});

Elham Bagheri 08 авг. 2017, в 14:14

Источник

0

Почему вы разбили текст?
Serge K. 08 авг. 2017, в 11:49

Теги:

javascript

arrays

substring

4 ответа

2

Я уверен, что если вы хотите получить 5 символов или 5 слов, я включил оба.

Получите элементы .cls, итерации с использованием .each(), и для каждого абзаца получите текст, а подстроку или срез - чтобы получить то, что вы хотите.

/** five characters **/
$('.test1 .cls').each(function() {
  $(this).text($(this).text().substring(0, 5));
});

/** five words **/
$('.test2 .cls').each(function() {
  $(this).text($(this).text().split(' ').slice(0, 5).join(' '));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test1">
  <p class="cls">1.Im try to use the click function </p>
  <p class="cls">2.Im try to use the click function </p>
  <p class="cls">3.Im try to use the click function </p>
</div>

<div class="test2">
  <p class="cls">1.Im try to use the click function </p>
  <p class="cls">2.Im try to use the click function </p>
  <p class="cls">3.Im try to use the click function </p>
</div>

Ori Drori 08 авг. 2017, в 09:50

1

сладкий и простой

$(document).ready(function () {
    $('.cls').each(function () {
            console.log("with substr(start,end) ::"+$(this).text().substr(0,4));
    });
});

Minesh 08 авг. 2017, в 09:48

0

Ну, если вы решили сделать это просто с чистой JS, вы можете просто сделать следующее:

document.querySelectorAll('div.test1 > p')
        .forEach(p => p.textContent = p.textContent.substr(0,5));

<div class="test1">
  <p class="cls">1.Im try to use the click function </p>
  <p class="cls">2.Im try to use the click function </p>
  <p class="cls">3.Im try to use the click function </p>
</div>

Redu 08 авг. 2017, в 12:47

Ещё вопросы

ꜱᴜʀᴇꜱʜ ᴀᴛᴛᴀ · Accepted Answer · 2017-08-08T09-41-00.000Z

Несколько проблем.

Вы не должны использовать общий селектор. Вы должны использовать текущий элемент, который является this.

Вы не нуждаетесь в цикле и расщеплении, поскольку получаете полный текст и просто подстройте его.

подстрока (0, 50) запускает вас в проблемы, так как в вашей строке не должно быть 50 символов. Вы имеете в виду 0,5 правильно?

    $(document).ready(function () {
    $('.cls').each(function () {
        var iTotalWords = $(this).text();        
        var result = iTotalWords.substr(0, 5);
        $(this).html(result); });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="test1">
    <p class="cls">1.Im try to use the click function </p>
    <p class="cls">2.Im try to use the click function </p>
    <p class="cls">3.Im try to use the click function </p>
</div>