Как вставить текст после родителя определённого кол-ва символов?

Уже долго не могу разобраться.. У меня есть блок, в котором есть текст (множество абзацев, где каждый в своём теге). Как мне вставить после родителя 20 символа текст (и можно ли реализовать сие без углубления в range)?

Например:

<p id="art1">Привет приятель</p><p id="art2">Пока мой друг</p>

здесь, 20-ым символом является К (поКа), и как мне на основе этого сделать так, чтобы я получил родителя, а значит

с id равным art2 ?


Ответы (1 шт):

Автор решения: Леонид

Перебираете элементы, суммируете длины их текстового содержимого:

const text = 'hello, world!!';
const max = 20;
let len = 0;

for (const p of document.querySelectorAll('p')) {
  len += p.textContent.length;
  if (len >= max) {
    p.insertAdjacentText('afterend', text);
    break;
  }
}
<p id="art1">Привет приятель</p>
<p id="art2">Пока мой друг</p>

источник

→ Ссылка