Читать текст в теге HTML <p> построчно в JavaScript

0

У меня есть задача, в которой мне нужно читать текст в теге ap по строкам (по одной строке за раз). Тэг p содержится в теге div, который также имеет идентификатор. Как я могу прочитать текст в теге p одной строки за раз в JavaScript. Я пробовал следующее, но это не помогло: -

var text = document.getElementById('wrap');
var lines = text.innerHTML.split('\n');

HTML не содержит никаких символов "\n". Когда линия превышает ширину div, содержимое тега p переходит к следующей строке. Я хочу прочитать весь контент этого тэга по очереди за раз. Это первый элемент массива строк - это первая строка содержимого, видимая в браузере, а второй элемент - вторая строка и так далее.

  • 2
    Зачем вам нужно читать по одной строке за раз?
Теги:

4 ответа

2

Используя чистый jquery,

var values = $('#wrap').text().split("\n");
   $.each(values , function(i){
          alert(values[i]);
       });

.text() вернет единственную текстовую часть в теге.

вы можете перебирать каждую строку, используя $.each()

демонстрация

Поделиться
  • 0
    Пробовал тоже, но значения возвращает мне массив, который имеет 3 элемента. Два из которых являются пустыми элементами, и один из них содержит весь текст тега p.
  • 0
    @Corporal Я отредактировал ответ и предоставил демо-версию для этого
Показать ещё 4 комментария
0

Я сделал для нее скрипку. Он замечает все слова внутри примера P # как span с классами CSS LINE0, LINE1,.... Все внутри P должно быть простым текстом.

var words = $('#example').text().replace(/\t/g, ' ').replace(/\r/g, ' ').replace(/\n/g, ' ').replace(/\s+/g, ' ').split(' ');
$('#example').html('<span>'+words.join('</span> <span>')+'</span>');
$('#example span').each(
    function (i,e)
    {
        var offsettop = $(e).offset(); 
        if (lines.indexOf(offsettop.top)===-1) lines.push(offsettop.top);
        $(e).addClass('line'+lines.indexOf(offsettop.top));
    });

Затем вы можете объединить соответствующую строку с:

var line = [];
$('#example span.line0').each(function(i,e){line.push($(e).html());});
console.log(line.join(' '));

Изображение 174551http://jsfiddle.net/mainpart/6aWnH/

Поделиться
0 
var text = document.getElementById('wrap');
var text = text.textContent.split("/(<br \/>|\n/");
var node;
while(node = text.shift()) {
   // do something with node
    alert(node);
}
Поделиться
0

Вы можете использовать свойство innerText.

var node=document.getElementById('wrap');
var text = node.innerText || node.textContent ; //innerText is not supported in firefox
var lines = text.split("\n")

Вы не должны использовать свойство innerHTML, так как оно вернет эквивалент html. Следовательно, все новые символы линии будут заменены тэгами.

Поделиться

Ещё вопросы

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