Sizzle Selector Engine
Die {{#invoke:Vorlage:lang|flat}} ist eine auf JavaScript basierende Engine zum Selektieren von Elementen innerhalb des Document Object Models (DOM). Die Engine, entwickelt vom jQuery-Team, ist Standalone nutzbar und ist mit der Version 1.3 des JavaScript-Frameworks 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><templatestyles src="Webarchiv/styles.css" />{{#if:20110925143724
| {{#ifeq: 20110925143724 | *
| {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }} (Archivversionen)
| {{#iferror: {{#time: j. F Y|20110925143724}}
| {{#if: || }}Der Wert des Parameters {{#if: wayback | wayback | Datum }} muss ein gültiger Zeitstempel der Form YYYYMMDDHHMMSS sein!
| {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2019-05-14 06:37:36 InternetArchiveBot | 2019-05-14 06:37:36 InternetArchiveBot | }} | des Vorlage:Referrer }} vom {{#time: j. F Y|20110925143724}} im Internet Archive{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
}}
}}
| {{#if:
| {{#iferror: {{#time: j. F Y|{{{webciteID}}}}}
| {{#switch: {{#invoke:Str|len|{{{webciteID}}}}}
| 16= {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2019-05-14 06:37:36 InternetArchiveBot | 2019-05-14 06:37:36 InternetArchiveBot | }} | des Vorlage:Referrer }} vom {{#time: j. F Y| 19700101000000 + {{#expr: floor {{#expr: {{#invoke:Str|sub|{{{webciteID}}}|1|10}}/86400}} }} days}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
| 9 = {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2019-05-14 06:37:36 InternetArchiveBot | 2019-05-14 06:37:36 InternetArchiveBot | }} | des Vorlage:Referrer}} vom {{#time: j. F Y| 19700101000000 + {{#expr: floor {{#expr: {{#invoke:Str|sub|{{#invoke:Expr|base62|{{{webciteID}}}}}|1|10}}/86400}} }} days}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
| #default= Der Wert des Parameters {{#if: webciteID | webciteID | ID }} muss entweder ein Zeitstempel der Form YYYYMMDDHHMMSS oder ein Schüsselwert mit 9 Zeichen oder eine 16-stellige Zahl sein!{{#if: || }}
}}
| c|{{{webciteID}}}}} {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }} ({{#if: {{#if: 2019-05-14 06:37:36 InternetArchiveBot | 2019-05-14 06:37:36 InternetArchiveBot | }} | des Vorlage:Referrer}} vom {{#time: j. F Y|{{{webciteID}}}}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
}}
| {{#if:
| Vorlage:Webarchiv/Today
| {{#if:
| Vorlage:Webarchiv/Generisch
| {{#if: Kurze Einführung in Sizzle | {{#invoke:WLink|getEscapedTitle|Kurze Einführung in Sizzle}} | {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}} }}
}}}}}}}}{{#if:2019-05-14 06:37:36 InternetArchiveBot
| Vorlage:Webarchiv/archiv-bot
}}{{#invoke:TemplatePar|check
|all = url=
|opt = text= wayback= webciteID= archive-is= archive-today= archiv-url= archiv-datum= ()= archiv-bot= format= original=
|cat = Wikipedia:Vorlagenfehler/Vorlage:Webarchiv
|errNS = 0
|template = Vorlage:Webarchiv
|format = *
|preview = 1
}}{{#ifexpr: {{#if:20110925143724|1|0}}{{#if:|+1}}{{#if:|+1}}{{#if:|+1}}{{#if:|+1}} <> 1
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Genau einer der Parameter 'wayback', 'webciteID', 'archive-today', 'archive-is' oder 'archiv-url' muss angegeben werden.|1}}
}}{{#if:
| {{#switch: {{#invoke:Webarchiv|getdomain|{{{archiv-url}}}}}
| web.archive.org =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von Internet Archive erkannt, bitte Parameter 'wayback' benutzen.|1}}
| webcitation.org =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von WebCite erkannt, bitte Parameter 'webciteID' benutzen.|1}}
| archive.today |archive.is |archive.ph |archive.fo |archive.li |archive.md |archive.vn =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von archive.today erkannt, bitte Parameter 'archive-today' benutzen.|1}}
}}{{#if:
| {{#iferror: {{#iferror:{{#invoke:Vorlage:FormatDate|Execute}}|}}
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Wert des Parameter 'archiv-datum' ist ungültig oder hat ein ungültiges Format.|1}}
| }}
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Pflichtparameter 'archiv-datum' wurde nicht angegeben.|1}}
}}
| {{#if:
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Parameter 'archiv-datum' ist nur in Verbindung mit 'archiv-url' angebbar.|1}}
}}
}}{{#if:{{#invoke:URLutil|isHostPathResource|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/}}
|| {{#if: || }}
}}{{#if: Kurze Einführung in Sizzle
| {{#if: {{#invoke:WLink|isBracketedLink|Kurze Einführung in Sizzle}}
| {{#if: || }}
}}
| {{#if: || }}
}}{{#switch:
|addlarchives|addlpages= {{#if: || }}{{#if: 1 |}}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: enWP-Wert im Parameter 'format'.|1}}
}}{{#ifeq: {{#invoke:Str|find|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/%7Carchiv}} |-1
|| {{#ifeq: {{#invoke:Str|find|{{#invoke:Str|cropleft|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/%7C4}}%7Chttp}} |-1
|| {{#switch: {{#invoke:Webarchiv|getdomain|http://www.myinkblog.com/2009/09/11/sizzle-a-look-at-jquerys-new-css-selector-engine/ }}
| abendblatt.de | daserste.ndr.de | inarchive.com | webcitation.org =
| #default = {{#if: || }}{{#if: 1 |}}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Archiv-URL im Parameter 'url' anstatt URL der Originalquelle. Entferne den vor der Original-URL stehenden Mementobestandteil und setze den Archivierungszeitstempel in den Parameter 'wayback', 'webciteID', 'archive.today' oder 'archive-is' ein, sofern nicht bereits befüllt.|1}}
}}
}}
}}</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 getElementById('idName'). 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 browserkompatible Lösung zu schaffen.<ref><templatestyles src="Webarchiv/styles.css" />{{#if:20110924072358
| {{#ifeq: 20110924072358 | *
| {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }} (Archivversionen)
| {{#iferror: {{#time: j. F Y|20110924072358}}
| {{#if: || }}Der Wert des Parameters {{#if: wayback | wayback | Datum }} muss ein gültiger Zeitstempel der Form YYYYMMDDHHMMSS sein!
| {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2024-05-11 09:27:08 InternetArchiveBot | 2024-05-11 09:27:08 InternetArchiveBot | }} | des Vorlage:Referrer }} vom {{#time: j. F Y|20110924072358}} im Internet Archive{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
}}
}}
| {{#if:
| {{#iferror: {{#time: j. F Y|{{{webciteID}}}}}
| {{#switch: {{#invoke:Str|len|{{{webciteID}}}}}
| 16= {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2024-05-11 09:27:08 InternetArchiveBot | 2024-05-11 09:27:08 InternetArchiveBot | }} | des Vorlage:Referrer }} vom {{#time: j. F Y| 19700101000000 + {{#expr: floor {{#expr: {{#invoke:Str|sub|{{{webciteID}}}|1|10}}/86400}} }} days}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
| 9 = {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }} {{#ifeq: | [] | [ | ( }}{{#if: {{#if: 2024-05-11 09:27:08 InternetArchiveBot | 2024-05-11 09:27:08 InternetArchiveBot | }} | des Vorlage:Referrer}} vom {{#time: j. F Y| 19700101000000 + {{#expr: floor {{#expr: {{#invoke:Str|sub|{{#invoke:Expr|base62|{{{webciteID}}}}}|1|10}}/86400}} }} days}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
| #default= Der Wert des Parameters {{#if: webciteID | webciteID | ID }} muss entweder ein Zeitstempel der Form YYYYMMDDHHMMSS oder ein Schüsselwert mit 9 Zeichen oder eine 16-stellige Zahl sein!{{#if: || }}
}}
| c|{{{webciteID}}}}} {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }} ({{#if: {{#if: 2024-05-11 09:27:08 InternetArchiveBot | 2024-05-11 09:27:08 InternetArchiveBot | }} | des Vorlage:Referrer}} vom {{#time: j. F Y|{{{webciteID}}}}} auf WebCite{{#if: | ; }}{{#ifeq: | [] | ] | ) }}
}}
| {{#if:
| Vorlage:Webarchiv/Today
| {{#if:
| Vorlage:Webarchiv/Generisch
| {{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle | {{#invoke:WLink|getEscapedTitle|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}} | {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/}} }}
}}}}}}}}{{#if:2024-05-11 09:27:08 InternetArchiveBot
| Vorlage:Webarchiv/archiv-bot
}}{{#invoke:TemplatePar|check
|all = url=
|opt = text= wayback= webciteID= archive-is= archive-today= archiv-url= archiv-datum= ()= archiv-bot= format= original=
|cat = Wikipedia:Vorlagenfehler/Vorlage:Webarchiv
|errNS = 0
|template = Vorlage:Webarchiv
|format = *
|preview = 1
}}{{#ifexpr: {{#if:20110924072358|1|0}}{{#if:|+1}}{{#if:|+1}}{{#if:|+1}}{{#if:|+1}} <> 1
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Genau einer der Parameter 'wayback', 'webciteID', 'archive-today', 'archive-is' oder 'archiv-url' muss angegeben werden.|1}}
}}{{#if:
| {{#switch: {{#invoke:Webarchiv|getdomain|{{{archiv-url}}}}}
| web.archive.org =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von Internet Archive erkannt, bitte Parameter 'wayback' benutzen.|1}}
| webcitation.org =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von WebCite erkannt, bitte Parameter 'webciteID' benutzen.|1}}
| archive.today |archive.is |archive.ph |archive.fo |archive.li |archive.md |archive.vn =
{{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Im Parameter 'archiv-url' wurde URL von archive.today erkannt, bitte Parameter 'archive-today' benutzen.|1}}
}}{{#if:
| {{#iferror: {{#iferror:{{#invoke:Vorlage:FormatDate|Execute}}|}}
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Wert des Parameter 'archiv-datum' ist ungültig oder hat ein ungültiges Format.|1}}
| }}
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Pflichtparameter 'archiv-datum' wurde nicht angegeben.|1}}
}}
| {{#if:
| {{#if: || }}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Der Parameter 'archiv-datum' ist nur in Verbindung mit 'archiv-url' angebbar.|1}}
}}
}}{{#if:{{#invoke:URLutil|isHostPathResource|http://snipplr.com/view/1696/}}
|| {{#if: || }}
}}{{#if: Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle
| {{#if: {{#invoke:WLink|isBracketedLink|Eine Beispielfunktion für das Selektieren aller Elemente einer gleichen Klasse, ohne Nutzung von Sizzle}}
| {{#if: || }}
}}
| {{#if: || }}
}}{{#switch:
|addlarchives|addlpages= {{#if: || }}{{#if: 1 |}}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: enWP-Wert im Parameter 'format'.|1}}
}}{{#ifeq: {{#invoke:Str|find|http://snipplr.com/view/1696/%7Carchiv}} |-1
|| {{#ifeq: {{#invoke:Str|find|{{#invoke:Str|cropleft|http://snipplr.com/view/1696/%7C4}}%7Chttp}} |-1
|| {{#switch: {{#invoke:Webarchiv|getdomain|http://snipplr.com/view/1696/ }}
| abendblatt.de | daserste.ndr.de | inarchive.com | webcitation.org =
| #default = {{#if: || }}{{#if: 1 |}}{{#invoke:TemplUtl|failure| Fehler bei Vorlage:Webarchiv: Archiv-URL im Parameter 'url' anstatt URL der Originalquelle. Entferne den vor der Original-URL stehenden Mementobestandteil und setze den Archivierungszeitstempel in den Parameter 'wayback', 'webciteID', 'archive.today' oder 'archive-is' ein, sofern nicht bereits befüllt.|1}}
}}
}}
}}</ref> Die Funktion zum Selektieren aller Elemente eines gleichen Typs getElementsByTagName sowie eine Funktion zum Selektieren aller Elemente mit einem Klassennamen getElementsByClassName wird von älteren Browsern nicht fehlerfrei unterstützt.<ref>Browser-Unterstützung für getElementsByTagName()</ref><ref>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 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 span-Elemente selektieren, die ein direktes Kind aller p-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
Einzelnachweise
<references />