imported>Uncopy: /* Problematik */ Weiche Formulierung "gleicher Typ" auf

2025-11-10T16:20:22Z

Problematik: Weiche Formulierung "gleicher Typ" auf

Neue Seite

[[Datei:Sizzle-Logo.svg|mini|Logo]]

Die {{lang|en|'''Sizzle Selector Engine'''}} ist eine auf [[JavaScript]] basierende [[Engine]] zum Selektieren von Elementen innerhalb des [[Document Object Model]]s (DOM). Die Engine, entwickelt vom [[jQuery]]-Team, ist [[Standalone]] nutzbar und ist mit der Version 1.3 des JavaScript-[[Framework]]s jQuery veröffentlicht worden. Sizzle ist nativer Bestandteil von jQuery; weil es von anderen Programmbibliotheken nicht abhängt, können Entwickler diese Engine aber auch in ihr Projekt integrieren.<ref>{{Webarchiv|url=http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/ |wayback=20110925143724 |text=Kurze Einführung in Sizzle |archiv-bot=2019-05-14 06:37:36 InternetArchiveBot }}</ref>

== Problematik ==
JavaScript bietet dem Entwickler nur eingeschränkte Möglichkeiten, Elemente des DOMs direkt zu selektieren. Eine native und breit unterstützte Möglichkeit zum Selektieren eines Elementes mit einer gegebenen ID ist die Nutzung der Funktion <code>getElementById('idName')</code>. Webentwickler referenzieren aber oft mehrere Elemente ähnlicher Art, etwa alle Elemente, die eine gleiche Klasse besitzen oder Elemente, die ein bestimmtes Attribut beinhalten. Für alle Einzelfälle muss der Entwickler oft mehrzeilige Funktionen schreiben, um eine [[Cross-Browser|browserkompatible]] Lösung zu schaffen.<ref>{{Webarchiv|url=http://snipplr.com/view/1696/ |wayback=20110924072358 |text=Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle |archiv-bot=2024-05-11 09:27:08 InternetArchiveBot }}</ref> Die Funktion zum Selektieren aller Elemente eines gleichen Typs <code>getElementsByTagName</code> sowie eine Funktion zum Selektieren aller Elemente mit einem Klassennamen <code>getElementsByClassName</code> wird von älteren Browsern nicht fehlerfrei unterstützt.<ref>[http://reference.sitepoint.com/javascript/Document/getElementsByTagName Browser-Unterstützung für ''getElementsByTagName()'']</ref><ref>[http://blog.justswell.org/clientside-getelementsbyclassname-cross-browser-implementation/ Internet-Explorer-kompatible Lösung für ''getElementsByClassName'']</ref> Mit [[HTML5]] werden zwar viele Selektionen innerhalb des DOM vereinfacht, jedoch wird dieser Standard des [[World Wide Web Consortium]] noch nicht von allen Browsern fehlerfrei unterstützt.

''Sizzle'' nimmt dem Entwickler diese Arbeit ab und stellt eine browserübergreifende, intuitive [[Programmierschnittstelle|API]] bereit.

== Prinzip ==
Die Selektion ist nahezu identisch mit denen der [[Cascading Style Sheets]], auch CSS3-Selektoren werden unterstützt.

== Beispiel ==
Möchte man alle <code>span</code>-Elemente selektieren, die ein direktes Kind aller <code>p</code>-Elemente sind, so erfolgt dies durch folgenden Code:
<syntaxhighlight lang="javascript">
Sizzle('p > span');
</syntaxhighlight>

Das Selektieren von Links, die example.org enthalten, erfolgt so:
<syntaxhighlight lang="javascript">
Sizzle('a[href*="example.org"]');
</syntaxhighlight>

Da Sizzle nahtlos in jQuery integriert ist, erfolgt eine Selektion in diesem Framework nach dem gleichen Prinzip:
<syntaxhighlight lang="javascript">
$('a[href*="example.org"]');
</syntaxhighlight>

== Weblinks ==
* [http://sizzlejs.com/ Sizzle-Projektsite]

== Einzelnachweise ==
<references />

[[Kategorie:JavaScript-Bibliothek]]

Sizzle Selector Engine - Versionsgeschichte

imported>Uncopy: /* Problematik */ Weiche Formulierung "gleicher Typ" auf