ProcessingInstruction

Konstruktor

ProcessingInstruction.ProcessingInstruction()

Erstellt eine neue Instanz des ProcessingInstruction-Objekts.

Entwickler können den ProcessingInstruction()-Konstruktor nicht direkt verwenden, um eine neue ProcessingInstruction-Instanz zu erstellen; dies führt zu einem "illegalen Konstruktor"-Fehler. Stattdessen sollte die Methode document.createProcessingInstruction() verwendet werden.

Instanz-Eigenschaften

Diese Schnittstelle erbt auch Eigenschaften von ihren Elternschnittstellen, CharacterData, Node, und EventTarget.

ProcessingInstruction.sheet Schreibgeschützt

Gibt das zugehörige StyleSheet-Objekt zurück, falls vorhanden; oder null, wenn keines vorhanden ist.

ProcessingInstruction.target Schreibgeschützt

Ein Name, der die Anwendung identifiziert, auf die die Anweisung abzielt.

Instanz-Methoden

Diese Schnittstelle erbt auch Methoden von ihren Elternschnittstellen, CharacterData, Node, und EventTarget.

ProcessingInstruction.getAttribute() Schreibgeschützt

Ruft den Wert des namentlich genannten Attributs vom aktuellen Knoten ab und gibt ihn als Zeichenkette zurück.

ProcessingInstruction.getAttributeNames() Schreibgeschützt

Gibt ein Array mit Attributnamen vom aktuellen Knoten zurück.

ProcessingInstruction.hasAttribute() Schreibgeschützt

Gibt einen booleschen Wert zurück, der angibt, ob das Element das spezifizierte Attribut besitzt oder nicht.

ProcessingInstruction.hasAttributes() Schreibgeschützt

Gibt einen booleschen Wert zurück, der angibt, ob das Element ein oder mehrere HTML-Attribute besitzt.

ProcessingInstruction.removeAttribute() Schreibgeschützt

Entfernt das namentlich genannte Attribut vom aktuellen Knoten.

ProcessingInstruction.setAttribute() Schreibgeschützt

Setzt das namentlich genannte Attribut des aktuellen Knotens auf einen neuen Wert.

ProcessingInstruction.toggleAttribute() Schreibgeschützt

Schaltet ein boolesches Attribut um, entfernt es, wenn es vorhanden ist, und fügt es hinzu, wenn es nicht vorhanden ist, auf dem angegebenen Element.

Diese Methoden bieten einen einfacheren Zugang zu den data-Zeichenfolgenattributen.

Beschreibung

Verarbeitungsanweisungen spezifizieren, wie ein Dokument verarbeitet werden soll. Sie können Stylesheets für XML-Dokumente, Platzhalter für HTML-Dokumente oder andere Verarbeitungsanweisungen beinhalten.

Verarbeitungsanweisungen sind Nodes und keine Elements. Sie haben keine Kinder und verursachen keine Verschachtelung (wie in unserem Patching-Beispiel demonstriert), und ändern daher nicht die Struktur des Document Object Model (DOM).

Ursprünglich wurden ProcessingInstruction-Knoten nur in XML-Dokumenten unterstützt, nicht in HTML-Dokumenten. In nicht unterstützenden Browsern werden Verarbeitungsanweisungen als Kommentare interpretiert und als Comment-Objekte im DOM-Baum dargestellt.

Wenn sie direkt in Dokumenten geschrieben werden, anstatt durch document.createProcessingInstruction() erstellt zu werden, beginnen und enden sie mit <? und ?>-Abgrenzern und enthalten ein target und optionale data-Attribute. Zum Beispiel:

<?my-target name="my-name"?>`.

Wenn sie in HTML geschrieben werden, können Verarbeitungsanweisungen mit oder ohne das abschließende ? bereitgestellt werden, und der Browser fügt es hinzu, wenn es beim Parsen des DOM nicht bereitgestellt wird. Sowohl <?my-target?> als auch <?my-target> sind daher gültig. XML ist strikter und erfordert das abschließende ?.

HTML hat auch mehr Einschränkungen für den target-Namen im HTML-Parser aus Gründen der Abwärtskompatibilität. Effektiv muss es [A-Za-z_][-_A-Za-z0-9]* entsprechen, oder es wird als Kommentar verarbeitet.

Obwohl die Syntax identisch zu der von Verarbeitungsanweisungen ist, wird die XML-Deklaration (<?xml version="1.0"?>) nicht als Verarbeitungsanweisung betrachtet und wird nicht dem DOM hinzugefügt.

Benutzerdefinierte Verarbeitungsanweisungen können nicht mit "xml" beginnen, da xml-präfixierte Processing-Instruction-Target-Namen durch die XML-Spezifikation für bestimmte, standardisierte Verwendungen reserviert sind (zum Beispiel <?xml-stylesheet ?>).

Aus Gründen der Abwärtskompatibilität wird die Verarbeitungsanweisung als Kommentar in einem HTML-Dokument geparst, wenn das Target xml oder xml-stylesheet ist. Dies gilt unabhängig davon, ob es im ursprünglichen HTML enthalten oder mit einer Methode wie Element.innerHTML eingefügt wird.

Beispiele

Grundlegende Verwendung

Dieses Beispiel zeigt eine Verarbeitungsanweisung mit einem target von display und data von table-view.

<?display table-view?>

Beispiel für reserviertes XML-Target

<?xml-stylesheet href="styles.css"?>

Dieses Beispiel zeigt eine Verarbeitungsanweisung mit einem Ziel von xml-stylesheet und data von href="styles.css".

Verwendung mit <template for>-Patching

Dieses Beispiel verwendet die Verarbeitungsanweisungen <?start> und <?end> als Platzhalter und füllt später den Inhalt mit <template for> aus. Beide schließen das optionale abschließende ? aus.

<body>
  <div>
    <?start name="placeholder">
    Loading...
    <?end>
  </div>
  ...
  <template for="placeholder">
    Lorem Ipsum...
  </template>
  ...
</body>

Dieses Beispiel zeigt auch das Fehlen von Verarbeitungskindern und Verschachtelung. Die Verarbeitungsanweisungen <?start> und <?end>, obwohl sie in Bezug auf <template for> verknüpft sind, sind nicht in Bezug auf das DOM verknüpft und verursachen nicht, dass der Loading...-Inhalt dazwischen ein Kind wird (wie das Fehlen der Einrückung zeigt).

Verwendung von Methoden im Gegensatz zum data-Attribut

Dieses Beispiel erstellt eine Verarbeitungsanweisung mit der Methode createProcessingInstruction(). Es protokolliert dann die Daten der Verarbeitungsanweisung (zugänglich über ihre CharacterData.data-Eigenschaft) und dann ihre beiden Attribute einzeln (zugänglich über ihre ProcessingInstruction.getAttribute()-Methode).

const pi = document.createProcessingInstruction(
  "my-target",
  "my-data1='value1' my-data2='value2'",
);

console.log(pi.data);
console.log(pi.getAttribute("my-data1"));
console.log(pi.getAttribute("my-data1"));
// logs
// my-data1='value1' my-data2='value2'
// value1
// value2

Spezifikationen

Browser-Kompatibilität

Siehe auch

• document.createProcessingInstruction()
• Das DOM-API