Как удалить определенные HTML теги?

Question

[laravel_creative_3103]

Условно, имеется тег div у которого есть дочерние теги a.. как можно удалить теги a, не затрагивая input h1 и p?

<div id="id">
                        <a class='1'>текст</a>
                        <a class='1'>текст</a>
                        <a class='1'>текст</a>
                        <input type='text'/>
                        <h1>Заголовок</h1>
                        <p>Удалить</p>
                    </div>

Answer 1

[Михаил Р.]

const elId = document.querySelector('#id');
const elsA = elId.querySelectorAll('a');

elsA.forEach((el) => el.remove());

<a class='1'>

In CSS1, a class name could start with a digit (".55ft"), unless it was a dimension (".55in"). In CSS2, such classes are parsed as unknown dimensions (to allow for future additions of new units) To make "2x" a valid class, CSS2 requires the first digit to be escaped ".\32x" [2x]

В CSS не рекомендуется использовать название класса начинающегося с цифры...

Comments

[Сергей delphinpro]

да сразу ссылки выбирать, раз уж там ID

const elsA = document.querySelector('#id > a');
elsA.forEach((el) => el.remove());

Answer 2

[PolarOne]

Вы не написали где именно удалить, ну в смысле через блокнот или на странице.
Вот можно скриптом - при просмотре кода (не кода страницы, а кода элемента) не будет тегов.

<!-- Добавьте следующий скрипт после вашего HTML кода -->
<script>
    // Находим элементы с тегом <a> внутри тега <div> по классу или другому селектору и удаляем их
    const divElement = document.getElementById("id");
    const aElements = divElement.querySelectorAll("a");
    
    aElements.forEach(aElement => {
        aElement.remove();
    });
</script>

А можно в блокноте с помощью регулярных выражений
<a.*?>.*?<\/a>
Но это не совсем точный инструмент будет при большом количестве элементов. Может удалить ссылки и не в блоке DIV.

Поэтому лучше скриптом, задать id элемента и что удалить.

Answer 3

[Николай Шабалин]

<script>
  // Получаем ссылки (<a>) с помощью querySelectorAll
  const links = document.querySelectorAll('#id a');

  // Проходимся по каждой ссылке и удаляем ее с помощью removeChild
  links.forEach(link => link.parentNode.removeChild(link));
</script>