ProcessingInstruction

Konstruktor

ProcessingInstruction.ProcessingInstruction()

Erstellt eine neue Instanz des ProcessingInstruction-Objekts.

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

Instanz-Eigenschaften

Diese Schnittstelle erbt auch Eigenschaften von ihren Elter-Schnittstellen, 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, an die die Anweisung gerichtet ist.

Instanz-Methoden

Diese Schnittstelle erbt auch Methoden von ihren Elter-Schnittstellen, CharacterData, Node, und EventTarget.

ProcessingInstruction.getAttribute() Schreibgeschützt

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

ProcessingInstruction.getAttributeNames() Schreibgeschützt

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

ProcessingInstruction.hasAttribute() Schreibgeschützt

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

ProcessingInstruction.hasAttributes() Schreibgeschützt

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

ProcessingInstruction.removeAttribute() Schreibgeschützt

Entfernt das benannte Attribut vom aktuellen Knoten.

ProcessingInstruction.setAttribute() Schreibgeschützt

Legt das benannte Attribut des aktuellen Knotens auf einen neuen Wert fest.

ProcessingInstruction.toggleAttribute() Schreibgeschützt

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

Diese Methoden bieten einen einfacheren Zugriff auf die Zeichenkettenattribute data.

Beschreibung

Verarbeitungsanweisungen geben, wie der Name schon sagt, an, wie ein Dokument verarbeitet werden soll. Sie können Stylesheets für XML-Dokumente, Platzhalter für HTML-Dokumente oder andere Verarbeitungsanweisungen enthalten.

Verarbeitungsanweisungen sind Nodes und keine Elements. Sie haben keine Kinder und verursachen keine Verschachtelung (wie in unserem Patching-Beispiel gezeigt) und verä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 mit document.createProcessingInstruction() erstellt zu werden, beginnen und enden sie mit den Trennzeichen <? und ?>, und enthalten Ziel- und optionale Datenattribute. 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 wird es hinzufügen, wenn es beim Parsen des DOM nicht vorhanden ist. Daher sind sowohl <?my-target?> als auch <?my-target> gültig. XML ist strikter und erfordert das abschließende ?.

HTML hat auch mehr Einschränkungen bezüglich des target-Namens im HTML-Parser für die Rückwärtskompatibilität. Effektiv muss es [A-Za-z_][-_A-Za-z0-9]* entsprechen, oder es wird als Kommentar verarbeitet.

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

Vom Benutzer definierte Verarbeitungsanweisungen dürfen nicht mit "xml" beginnen, da von der XML-Spezifikation für bestimmte, standardmäßige Verwendungen verarbeitungsanweisungszielnamen mit xml-Präfix reserviert sind (zum Beispiel <?xml-stylesheet ?>).

Zur Rückwärtskompatibilität, wenn das Ziel xml oder xml-stylesheet ist, wird die Verarbeitungsanweisung als Kommentar in einem HTML-Dokument geparst. Dies gilt, unabhängig davon, ob es im ursprünglichen HTML enthalten ist 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?>

Reserviertes XML-Ziel-Beispiel

<?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> Patchen

Dieses Beispiel verwendet die <?start> und <?end> Verarbeitungsanweisungen als Platzhalter und füllt später die Inhalte 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 ebenfalls das Fehlen von Kindern und Verschachtelung von Verarbeitungsanweisungen. Die <?start> und <?end> Verarbeitungsanweisungen sind, obwohl sie im Zusammenhang von <template for> verknüpft sind, im Zusammenhang des DOM nicht verknüpft und führen nicht dazu, dass der Loading...-Inhalt dazwischen ein Kind ist (wie durch das Fehlen von Einrückungen gezeigt).

Methoden verwenden anstelle des data Attributs

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

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-data2"));
// logs
// my-data1='value1' my-data2='value2'
// value1
// value2

Spezifikationen

Browser-Kompatibilität

Siehe auch

• document.createProcessingInstruction()
• Die DOM-API