Leere Absätze mit jQuery entfernen
Von Jonas Leere Absätze sind im CMS schnell erzeugt und sorgen für ein unsauberes Layout. Mit jQuery können leere P-Tags gefunden und entfernen werden.
Viele Content Management Systeme – z. B. WordPress – erzeugen leere Absätze, wenn der Redakteur im WYSIWYG-Editor mehrmals Enter drückt. Oft ist der somit entstehende Abstand vom Redakteur sogar gewünscht, doch vor dem Hintergrund eines einheitlichen Layouts, möchten Frontend-Designer die Abstände gerne verhindern. Mit jQuery können leere Absätze gefunden und entfernt werden.
jQuery: Leere P-Tags (<p></p>, <p> </p>) finden und löschen
Die folgende each-Schleife sucht zunächst im Code nach allen <p>-Tags. Anschließend wird mit einer Regular Expression analysiert, ob gar nichts oder ein geschütztes Leerzeichen enthalten ist ( ). Wenn das der Fall ist, wird mit remove() der Absatz entfernt.
$('p').each(function() {
var $this = $(this);
if($this.html().replace(/\s| /g, '').length == 0)
$this.remove();
});Geschrieben von Jonas
Jonas ist Gründer der Agentur kulturbanause und des kulturbanause Blogs. Er arbeitet an der Schnittstelle zwischen UX/UI Design, Frontend und Redaktion und hat zahlreiche Fachbücher und Video-Trainings veröffentlicht. Jonas Hellwig ist regelmäßig als Sprecher auf Fachveranstaltungen anzutreffen und unterstützt mit Seminaren und Workshops Agenturen und Unternehmen bei der Planung, der Gestaltung und der technischen Umsetzung von Web-Projekten.
