Jak usunąć fragment kodu HTML?

Aby usunąć fragment kodu HTML, możesz wykorzystać różne metody, zależnie od kontekstu: ręczna edycja kodu, wykorzystanie JavaScript na stronie WWW lub narzędzia serwerowe. W artykule znajdziesz szczegółowe wyjaśnienia oraz gotowe przykłady zastosowań.

Ręczne usuwanie fragmentu kodu HTML

Najprostszy sposób stosowany podczas edycji plików HTML – polega na ręcznym skasowaniu określonego bloku kodu w edytorze tekstu lub edytorze stron WWW.

Przykład –

Mamy kod:

<div>
  <p>Tutaj tekst, który ma zostać.</p>
  <span>Ten fragment chcę usunąć</span>
</div>

Aby usunąć fragment, wystarczy skasować w edytorze linię:

<span>Ten fragment chcę usunąć</span>

Efekt końcowy:

<div>
  <p>Tutaj tekst, który ma zostać.</p>
</div>

Kiedy stosować?

przy edycji statycznych stron,
usuwaniu jednorazowych fragmentów.

Usuwanie fragmentu HTML za pomocą JavaScript

Dynamiczne usuwanie elementu na stronie umożliwia JavaScript oraz tzw. DOM API. Możliwe jest usunięcie pojedynczego elementu, wielu elementów lub opróżnienie całego kontenera.

Podstawowe metody

element.remove() – usuwa wskazany element z DOM (dokumentu);
parentElement.removeChild(childElement) – usuwa wskazane dziecko z rodzica.

Przykład kodu

<div class="div-test-remove">
  <span id="do-usuniecia">Element do usunięcia</span>
</div>
<button id="usun">Usuń fragment</button>
<script>
  const el = document.querySelector("#do-usuniecia");
  const btn = document.querySelector("#usun");
  btn.addEventListener("click", () => {
    el.remove(); // natychmiast usuwa span
    // Alternatywnie:
    // el.parentElement.removeChild(el);
  });
</script>

Usuwanie wszystkich dzieci danego elementu

const ul = document.querySelector("#list");
while (ul.firstChild) {
  ul.removeChild(ul.firstChild);
}
// Lub szybciej:
ul.innerHTML = "";

Praktyczne sytuacje

ukrywanie lub usuwanie popupów, powiadomień, dynamicznych wyników wyszukiwania,
podczas działania aplikacji SPA (Single Page Apps),
rozwijanie, zwijanie sekcji strony.

Usuwanie fragmentów kodu HTML w WordPressie

W WordPressie często usuwa się określone fragmenty kodu HTML generowane przez motyw lub mechanizmy CMS. Do tego służą dedykowane funkcje.

Przykład dla usunięcia niechcianych metatagów z sekcji head

<?php
remove_action('wp_head', 'rsd_link');
remove_action('wp_head', 'wlwmanifest_link');
remove_action('wp_head', 'wp_generator');
remove_action('wp_head', 'start_post_rel_link');
remove_action('wp_head', 'index_rel_link');
remove_action('wp_head', 'adjacent_posts_rel_link');
?>

Umieszcza się je w pliku functions.php motywu.

Zastosowania

sprzątanie nadmiarowego kodu generowanego automatycznie przez platformę,
poprawa SEO i wydajności stron,
likwidacja tagów ujawniających wersję WordPressa.

Usuwanie fragmentu HTML podczas generowania stron po stronie serwera

W niektórych przypadkach fragmenty kodu HTML są usuwane w backendzie podczas generowania strony (np. w PHP, Pythonie, Node.js):

poprzez warunki (if, switch), które nie renderują określonych bloków,
za pomocą wyrażeń regularnych, gdy przetwarzanie odbywa się na surowych plikach.

Praktyczne przykłady

usuwanie kodu debugującego przed publikacją,
dostosowanie HTML do różnych wersji językowych i urządzeń.

Podsumowanie praktycznych zastosowań

Ręczna edycja kodu – szybka i łatwa przy statycznych stronach;
JavaScript/DOM – dynamiczne, interaktywne modyfikacje na żywo;
WordPress/PHP – automatyczne usunięcie generowanych fragmentów przez CMS/motyw;
Backend – dopasowanie zawartości HTML przed przesłaniem do przeglądarki użytkownika.

Każda z opisanych metod ma zastosowanie w określonych sytuacjach – wybierz tę, która najlepiej odpowiada twoim potrzebom i kontekstowi działania strony.