Crée un élément avec l'URI de l'espace de noms spécifié et un nom qualifié.

Pour créer un élément sans spécifier d'URI d'espace de noms, utilisez la méthode createElement .

Syntaxe

var element = document.createElementNS(namespaceURI, qualifiedName[, options]);

Paramètres

namespaceURI
est une chaîne de caractères qui spécifie l'URI de l'espace de noms à associer à l'élément. La propriété namespaceURI de l'élément créé est initialisée avec la valeur de namespaceURI. voir URI d'espaces de nom valides
qualifiedName
est une chaîne de caractères qui spécifie le type de l'élément à créer. La propriété nodeName de l'élément créé est initialisée avec la valeur de qualifiedName
Options Facultatif
Un objet facultatif ElementCreationOptions contient une propriété unique nommée is, dont la valeur est le nom de la balise pour un élément personnalisé défini précédemment à l'aide de  customElements.define() . Pour la rétro-compatibilité avec les versions précédentes de la spécification des éléments personnalisés, quelques navigateurs vous permettront de passer ici une chaîne de caractères à la place d'un objet, pour laquelle la valeur est un nom d'élément personnalisé. Voir  Extending native HTML elements  pour plus d'informations sur la façon d'utiliser ce paramètre.
Le nouvel élément recevra un attribut is dont la valeur est le nom de la balise de l'élément personnalisé. Les éléments personnalisés sont une fonctionnalité expérimentale disponible uniquement dans certains navigateurs.

Valeur de retour

Le nouvel element.

URI d'espaces de nom valides

  • HTML - Utiliser http://www.w3.org/1999/xhtml
  • SVG - Utiliser http://www.w3.org/2000/svg
  • XBL - Utiliser http://www.mozilla.org/xbl
  • XUL - Utiliser http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul

Exemple

Cet exemple crée un nouvel élément <div> dans l'espace de noms XHTML et l'ajoute à l'élément vbox. Bien que ce ne soit pas un document XUL très utile, cela montre l'utilisation d'éléments de deux espaces de noms différents au sein d'un même document :

<?xml version="1.0"?>
<page xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
      xmlns:html="http://www.w3.org/1999/xhtml"
      title="||Working with elements||"
      onload="init()">

<script type="text/javascript"><![CDATA[
 var container;
 var newdiv;
 var txtnode;

 function init(){
   container = document.getElementById("ContainerBox");
   newdiv = document.createElementNS("http://www.w3.org/1999/xhtml","div");
   txtnode = document.createTextNode("This is text that was constructed dynamically with createElementNS and createTextNode then inserted into the document using appendChild.");
   newdiv.appendChild(txtnode);
   container.appendChild(newdiv);
 }

]]></script>

 <vbox id='ContainerBox' flex='1'>
  <html:div>
   Le script sur cette page ajoutera du contenu dynamique ci-dessous :
  </html:div>
 </vbox>

</page>

Note : Cet exemple utilise un script interne, ce qui n'est pas recommandé dans les documents XHTML. Cet exemple particulier est en fait un document XUL intégrant du XHTML. Cependant, la recommandation s'applique quand même.

Spécifications

Spécification Statut Commentaire
DOM
La définition de 'Document.createElement' dans cette spécification.
Standard évolutif  

Compatibilité des navigateurs

Nous convertissons les données de compatibilité dans un format JSON. Ce tableau de compatibilité utilise encore l'ancien format car nous n'avons pas encore converti les données qu'il contient. Vous pouvez nous aider en contribuant !

     
Fonctionnalité Chrome Edge Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Oui) (Oui) (Oui) (Oui) (Oui) (Oui)
options argument (Oui)[1] Pas de support 50 (50)[2][3] ? ? ?
  
Fonctionnalité Android Edge Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support (Oui) (Oui) (Oui) (Oui) (Oui) (Oui)

[1] Dans les versions précédentes de la spécification, cet argument était juste une chaîne de caractères dont la valeur était un nom d'élément personnalisé. Par souci de compatibilité ascendante, Chrome accepte les deux formes .

[2] Voir [1] ci-dessus : comme Chrome, Firefox accepte une chaîne au lieu d'un objet ici, mais seulement à partir de la version 51 et suivantes. Dans la version 50, les options doivent être un objet.

[3] Pour expérimenter avec des éléments personnalisés dans Firefox, vous devez définir les préférences dom.webcomponents.enabled et dom.webcomponents.customelements.enabled à true (vrai).

Voir aussi

Étiquettes et contributeurs liés au document

Contributeurs à cette page : loella16, lotfire24, fscholz, Twidi
Dernière mise à jour par : loella16,