Вставьте после фрагмента
У нас есть строка с HTML-документом.
Напишите регулярное выражение которое вставляет <h1>Hello</h1>
сразу же после тега <body>
. У тега могут быть атрибуты.
Например:
let regexp = /ваше регулярное выражение/;
let str = `
<html>
<body style="height: 200px">
...
</body>
</html>
`;
str = str.replace(regexp, `<h1>Hello</h1>`);
После этого значение str
:
<html>
<body style="height: 200px"><h1>Hello</h1>
...
</body>
</html>
Для того, чтобы вставить после тега <body>
, нужно вначале его найти. Мы можем использовать регулярное выражение <body.*?>
для этого.
В этом задании нам не нужно изменять <body>
тег. Нам нужно только добавить текст после него.
Вот как мы можем это сделать:
let str = '...<body style="...">...';
str = str.replace(/<body.*?>/, '$&<h1>Hello</h1>');
alert(str); // ...<body style="..."><h1>Hello</h1>...
В строке замены $&
означает само совпадение, то есть мы заменяем ту часть текста которая соответствует <body.*?>
. Совпадение заменяется на самого себя плюс <h1>Hello</h1>
.
Альтернативный вариант – использовать ретроспективную проверку:
let str = '...<body style="...">...';
str = str.replace(/(?<=<body.*?>)/, `<h1>Hello</h1>`);
alert(str); // ...<body style="..."><h1>Hello</h1>...
Как вы можете видеть, в этом регулярном выражении есть только ретроспективная часть.
Это работает вот так:
- В каждой позиции текста.
- Проверяет не предшествует ли ему
<body.*?>
. - Если это так, то мы встретили совпадение.
Тег <body.*?>
не вернётся. Результатом этого регулярного выражения является буквально пустая строка, но она совпадает только в позициях, которым предшествует <body.*?>
.
Происходит замена «пустой строки», которой предшествует <body.*?>
на <h1>Hello</h1>
. Что, как раз, и есть вставка этой строки после <body>
.
P.S. Флаги регулярных выражений, такие как s
и i
, также могут быть полезны: /<body.*?>/si
. Флаг s
создает точечный .
соответствует символу новой строки, а флаг i
делает <body>
также соответствующим <BODY>
без учета регистра.