Как разбить текст на строки?

Question

[Undefined User]

Есть какой-то текст, каждую строку которого нужно обернуть в span. Для этого, текст сначала нужно разбить на эти самые строки, если я все правильно понял. Как это можно сделать на ванильном js? Без jQuery.
Было:

<p>qwerty321
qwerty321
qwerty321</p>

Стало:

<p><span>qwerty321</span>
<span>qwerty321</span>
<span>qwerty321</span></p>

Answer 1

[Чипекве]

const pBlock = document.querySelector('p');
pBlock.innerHTML = pBlock.innerHTML.split('\n').map(string => `<span>${string}</span>`).join('');

Answer 2

[tempick]

Я вижу единственный выход - проходить посимвольно и на смиволе переноса строки останавливаться и вставлять span. Но вообще, мне кажется, если у вас возникла такая задача, то тут проблема где-то несколькими уровнями выше

Comments

[Undefined User]

Мне нужно сделать эффект построчного появления текста при скролле. Каким иным образом это тогда можно сделать?

[tempick]

Undefined User, самое оптимальное на мой взгляд - разбить текст на строки изначально (на сервере), а на js получать уже просто массив из строк. И при событии скроллинга сверять ккординаты и выводить новую строку, если пользователь проскроллил ниже строки, которая уже отображается. Вообще, если это идея дизайнеров, я бы им за такое по шапке настучал

[Undefined User]

tempick, в том то и проблема, что на сервере ничего разбиваться не будет

[Undefined User]

tempick, а со скроллом я и сам знаю как поступать. На вот этом вот застрял