Вставка після Head
У нас є рядок з HTML-документом.
Напишіть регулярний вираз який вставляє <h1>Привіт</h1> одразу після тегу <body>. Тег може мати атрибути.
Приклад:
let regexp = /ваш регулярний вираз/; let str = ` <html> <body style="height: 200px"> ... </body> </html> `; str = str.replace(regexp, `<h1>Привіт</h1>`);Після цього значення str має бути:
<html> <body style="height: 200px"><h1>Привіт</h1> ... </body> </html>Щоб вставити після тегу <body> , нам потрібно спершу його знайти. Ми можемо використати для цього регулярний вираз <body.*?>.
В цьому завданні нам не потрібно змінювати тег <body>. Нам потрібно тільки додати текст після нього.
Ось таким чином ми можемо це зробити:
let str = '...<body style="...">...'; str = str.replace(/<body.*?>/, '$&<h1>Привіт</h1>'); alert(str); // ...<body style="..."><h1>Привіт</h1>...в заміненому рядку $& означає співпадіння саме по собі, тобто, частина вихідного тексту яка відповідає шаблону <body.*?>. Її замінено на неї ж плюс <h1>Привіт</h1>.
Альнернативою було би використання зворотньої перевірки:
let str = '...<body style="...">...'; str = str.replace(/(?<=<body.*?>)/, `<h1>Привіт</h1>`); alert(str); // ...<body style="..."><h1>Привіт</h1>...Як бачите, в цьому регулярному виразі є тільки зворотня перевірка.
Це працює таким чином:
- На кожній позиції в тексті.
- Перевірте, чи йому передує
<body.*?>. - Якщо це так, то у нас є співпадіння.
The tag <body.*?> won’t be returned. The result of this regexp is literally an empty string, but it matches only at positions preceded by <body.*?>.
So it replaces the “empty line”, preceded by <body.*?>, with <h1>Hello</h1>. That’s the insertion after <body>.
P.S. Regexp flags, such as s and i can also be useful: /<body.*?>/si. The s flag makes the dot . match a newline character, and i flag makes <body> also match <BODY> case-insensitively.