From 6772831200d14c2436aea2d0c837f40dbf12156f Mon Sep 17 00:00:00 2001
From: SphinxKnight {{ ApiRef() }} Renvoie l'élément qui dispose actuellement du focus. {{ Note("Cet attribut fait partie de la spécification HTML 5 encore en développement.") }} {{ languages( { "en": "en/DOM/document.activeElement", "es": "es/DOM/element.activeElement", "ja": "ja/DOM/document.activeElement", "pl": "pl/DOM/document.activeElement" } ) }} Adopte un noeud. Le noeud (et son sous-arbre) est supprimé du document dans lequel il se trouve (le cas échéant) et son Adopte un noeud. Le noeud (et son sous-arbre) est supprimé du document dans lequel il se trouve (le cas échéant) et son Pris en charge depuis Gecko 1.9 (Firefox 3) En général l'appel de Les nœuds provenant de documents externes doivent être clonés à l'aide de Les nœuds provenant de documents externes doivent être clonés à l'aide de Gecko n'obligeait pas à utiliser Gecko n'obligeait pas à utiliser for JS w/ language-js class
* Remove
for HTML w/ language-html class
* Remove
for other lang w/ language-* class
* Rm highlighted line in code samples
* fix links, internal, external, absolute URLs
* missing file from last commit
* Fix styles errors apart from table + some classes
* Fix notes and warnings (+ some other :x)
* fix typo during merge which broke a doc
* aand forgot a conflict
* fix remaining classes of errors except dls and images
* Fix dls
* Fix images (deki/mozillademos) and remaining style issues
* Remove script tag from svg file
* Remove script tag from svg fileS
* Compress SVG files for CI
---
files/fr/web/api/document/activeelement/index.html | 17 +-
files/fr/web/api/document/adoptnode/index.html | 24 +--
files/fr/web/api/document/alinkcolor/index.html | 4 +-
files/fr/web/api/document/anchors/index.html | 8 +-
files/fr/web/api/document/applets/index.html | 10 +-
files/fr/web/api/document/body/index.html | 11 +-
.../api/document/caretrangefrompoint/index.html | 4 +-
files/fr/web/api/document/characterset/index.html | 2 +-
files/fr/web/api/document/clear/index.html | 2 +-
files/fr/web/api/document/compatmode/index.html | 16 +-
files/fr/web/api/document/contenttype/index.html | 6 +-
.../fr/web/api/document/createattribute/index.html | 8 +-
.../web/api/document/createcdatasection/index.html | 10 +-
files/fr/web/api/document/createcomment/index.html | 8 +-
.../api/document/createdocumentfragment/index.html | 28 ++--
files/fr/web/api/document/createelement/index.html | 4 +-
.../fr/web/api/document/createelementns/index.html | 55 +++----
.../api/document/createentityreference/index.html | 6 +-
files/fr/web/api/document/createevent/index.html | 24 ++-
.../web/api/document/createexpression/index.html | 10 +-
.../web/api/document/createnodeiterator/index.html | 24 +--
.../web/api/document/creatensresolver/index.html | 18 +--
.../createprocessinginstruction/index.html | 14 +-
files/fr/web/api/document/createrange/index.html | 10 +-
.../fr/web/api/document/createtextnode/index.html | 46 +++---
files/fr/web/api/document/defaultview/index.html | 17 +-
files/fr/web/api/document/designmode/index.html | 8 +-
files/fr/web/api/document/dir/index.html | 4 +-
files/fr/web/api/document/document/index.html | 2 +-
.../fr/web/api/document/documentelement/index.html | 14 +-
.../web/api/document/documenturiobject/index.html | 12 +-
files/fr/web/api/document/domain/index.html | 26 ++-
.../api/document/domcontentloaded_event/index.html | 6 +-
files/fr/web/api/document/drag_event/index.html | 14 +-
files/fr/web/api/document/dragend_event/index.html | 58 +++----
.../fr/web/api/document/dragenter_event/index.html | 58 +++----
.../fr/web/api/document/dragleave_event/index.html | 38 ++---
.../fr/web/api/document/dragover_event/index.html | 144 ++++++++---------
.../fr/web/api/document/dragstart_event/index.html | 14 +-
files/fr/web/api/document/drop_event/index.html | 148 +++++++++--------
.../web/api/document/elementfrompoint/index.html | 18 +--
.../web/api/document/elementsfrompoint/index.html | 6 +-
.../document/enablestylesheetsforset/index.html | 10 +-
files/fr/web/api/document/evaluate/index.html | 16 +-
files/fr/web/api/document/execcommand/index.html | 175 ++++++---------------
.../fr/web/api/document/exitfullscreen/index.html | 6 +-
files/fr/web/api/document/forms/index.html | 52 +++---
.../api/document/fullscreenchange_event/index.html | 2 +-
.../api/document/fullscreenerror_event/index.html | 2 +-
.../fr/web/api/document/getboxobjectfor/index.html | 12 +-
.../fr/web/api/document/getelementbyid/index.html | 99 ++++++------
.../api/document/getelementsbyclassname/index.html | 74 ++++-----
.../web/api/document/getelementsbyname/index.html | 44 +++---
.../api/document/getelementsbytagname/index.html | 142 ++++++++---------
.../api/document/getelementsbytagnamens/index.html | 30 ++--
files/fr/web/api/document/getselection/index.html | 2 +-
files/fr/web/api/document/hasfocus/index.html | 84 +++++-----
files/fr/web/api/document/head/index.html | 7 +-
files/fr/web/api/document/height/index.html | 2 +-
files/fr/web/api/document/images/index.html | 29 ++--
.../fr/web/api/document/implementation/index.html | 20 +--
files/fr/web/api/document/importnode/index.html | 30 ++--
files/fr/web/api/document/index.html | 62 ++++----
.../fr/web/api/document/keypress_event/index.html | 6 +-
files/fr/web/api/document/lastmodified/index.html | 19 +--
.../web/api/document/laststylesheetset/index.html | 14 +-
files/fr/web/api/document/location/index.html | 16 +-
.../web/api/document/mozsetimageelement/index.html | 10 +-
.../api/document/mozsyntheticdocument/index.html | 6 +-
.../api/document/onafterscriptexecute/index.html | 2 +-
.../api/document/onbeforescriptexecute/index.html | 2 +-
files/fr/web/api/document/onoffline/index.html | 2 +-
files/fr/web/api/document/ononline/index.html | 12 +-
files/fr/web/api/document/open/index.html | 14 +-
files/fr/web/api/document/popupnode/index.html | 8 +-
.../api/document/preferredstylesheetset/index.html | 10 +-
.../web/api/document/querycommandstate/index.html | 2 +-
.../api/document/querycommandsupported/index.html | 5 +-
files/fr/web/api/document/queryselector/index.html | 28 ++--
.../web/api/document/queryselectorall/index.html | 12 +-
files/fr/web/api/document/readystate/index.html | 20 +--
.../api/document/readystatechange_event/index.html | 4 +-
files/fr/web/api/document/referrer/index.html | 8 +-
.../fr/web/api/document/registerelement/index.html | 12 +-
.../fr/web/api/document/releasecapture/index.html | 8 +-
files/fr/web/api/document/scripts/index.html | 2 +-
files/fr/web/api/document/scroll_event/index.html | 11 +-
.../api/document/selectedstylesheetset/index.html | 20 ++-
files/fr/web/api/document/stylesheets/index.html | 8 +-
.../fr/web/api/document/stylesheetsets/index.html | 10 +-
files/fr/web/api/document/title/index.html | 12 +-
files/fr/web/api/document/tooltipnode/index.html | 4 +-
.../fr/web/api/document/touchend_event/index.html | 6 +-
.../api/document/transitionend_event/index.html | 12 +-
files/fr/web/api/document/url/index.html | 6 +-
.../fr/web/api/document/visibilitystate/index.html | 8 +-
files/fr/web/api/document/width/index.html | 12 +-
files/fr/web/api/document/write/index.html | 30 ++--
files/fr/web/api/document/writeln/index.html | 14 +-
files/fr/web/api/document/xmlencoding/index.html | 10 +-
files/fr/web/api/document/xmlversion/index.html | 4 +-
101 files changed, 1077 insertions(+), 1168 deletions(-)
(limited to 'files/fr/web/api/document')
diff --git a/files/fr/web/api/document/activeelement/index.html b/files/fr/web/api/document/activeelement/index.html
index fe982e77d7..2b09fac218 100644
--- a/files/fr/web/api/document/activeelement/index.html
+++ b/files/fr/web/api/document/activeelement/index.html
@@ -8,19 +8,14 @@ translation_of_original: Web/API/Document/activeElement
original_slug: Web/API/DocumentOrShadowRoot/activeElement
---
Résumé
+Résumé
Syntaxe
+Syntaxe
var elemCourant = document.activeElement;
-Exemple
-Spécification
+Exemple
+Spécification
-
-ownerDocument
(document propriétaire) est remplacé par le document en cours. Le noeud peut ensuite être inséré dans le document en cours.ownerDocument
(document propriétaire) est remplacé par le document en cours. Le noeud peut ensuite être inséré dans le document en cours.Syntaxe
+Syntaxe
node = document.adoptNode(externalNode);
-
- node
ownerDocument
(document propriétaire). Le parentNode
du noeud est null
, car il n'a pas encore été inséré dans l'arborescence du document. Notez que node
et externalNode
sont le même objet après cet appel. node
ownerDocument
(document propriétaire). Le parentNode
du noeud est null
, car il n'a pas encore été inséré dans l'arborescence du document. Notez que node
et externalNode
sont le même objet après cet appel. externalNode
Exemple
+Exemple
var iframe = document.getElementById('my-iframe');
var iframeImages = iframe.contentDocument.getElementsByTagName('img');
@@ -42,20 +42,20 @@ for (var i = 0; i < iframeImages.length; i++) {
}
-Notes
+Notes
adoptNode
peut échouer en raison du nœud source provenant d'une implémentation différente, mais cela ne devrait pas poser de problème avec les implémentations du navigateur.document.importNode()
(ou adoptés avec
- document.adoptNode()
) avant de pouvoir être insérés dans le document courant. Pour en savoir plus sur les problèmes
- de Node.ownerDocument
, consultez la FAQ DOM du W3C (en anglais).document.importNode()
(ou adoptés avec
+ document.adoptNode()
) avant de pouvoir être insérés dans le document courant. Pour en savoir plus sur les problèmes
+ de Node.ownerDocument
, consultez la FAQ DOM du W3C (en anglais).document.importNode()
et document.adoptNode()
avant sa version 1.9. Depuis les versions 1.9
+ document.importNode()
et document.adoptNode()
avant sa version 1.9. Depuis les versions 1.9
alphas, si un nœud n'est pas adopté ou importé avant d'être utilisé dans un autre document, l'exception
- WRONG_DOCUMENT_ERR
est déclenchée (NS_ERROR_DOM_WRONG_DOCUMENT_ERR
). implémentation dans le bug 47903.WRONG_DOCUMENT_ERR
est déclenchée (NS_ERROR_DOM_WRONG_DOCUMENT_ERR
). implémentation dans le bug 47903.
La valeur par défaut pour cette propriété est rouge (#ee000
en hexadécimal) sur Mozilla Firefox.
document.alinkColor
est obsolète dans DOM Level 2 HTML (lien en anglais). Une alternative est le sélecteur CSS {{Cssxref(":active")}}.
document.alinkColor
est obsolète dans DOM Level 2 HTML (lien en anglais). Une alternative est le sélecteur CSS {{Cssxref(":active")}}.
Une autre alternative est document.body.aLink
, même si elle est obsolète dans HTML 4.01 (lien en anglais) en faveur de l'alternative CSS ci-dessus.
Une autre alternative est document.body.aLink
, même si elle est obsolète dans HTML 4.01 (lien en anglais) en faveur de l'alternative CSS ci-dessus.
Gecko supporte alinkColor
/:active
et {{Cssxref(":focus")}}. Internet Explorer 6 et 7 supportent alinkColor
/:active
seulement pour la balise HTML des liens (<a>) et le comportement est le même que :focus
sur Gecko. Il n'y a pas de support pour :focus
sur IE.
anchors
retourne une liste de toutes les ancres du document.
nodeList = document.anchors;-
if ( document.anchors.length >= 5 ) { dump("Trop d'ancres trouvées !"); @@ -70,11 +70,11 @@ function init() { -Notes
+Notes
Pour des raisons de rétrocompatibilité, la liste d'ancres retournée contient seulement les ancres créées avec l'attribut
-name
, pas celles créées avec l'attributid
.Spécification
+Spécification
{{ ApiRef() }}
-applets
retourne une liste ordonnée des applets contenus dans un document.
nodeList = document.applets-
// ( Si vous savez que le second applet est celui que vous voulez ) my_java_app = document.applets[1];-
Retourne l'élément <body>
ou <frameset>
du document courant.
var objRef = document.body; document.body = objRef;-
// dans le HTML: <body id="ancienElementBody"></body> alert(document.body.id); // "ancienElementBody" @@ -23,10 +22,10 @@ unNouvelElementBody .id = "nouvelElementBody"; document.body = unNouvelElementBody ; alert(document.body.id); // "nouvelElementBody"-
document.body
est l'élément dans lequel le contenu du document est situé. Dans les documents avec un élément <body>
celui-ci est retourné, et dans les documents de type frameset l'élément <frameset>
le plus extérieur est retourné.
Même si body est modifiable, lui affecter une nouvelle valeur retire tous les éléments enfants du <body>
existant.
Démonstration de base : lorsque vous cliquez dans un paragraphe, insérez un saut de ligne à la position du curseur :
diff --git a/files/fr/web/api/document/characterset/index.html b/files/fr/web/api/document/characterset/index.html index fb023e7871..d43772b7fb 100644 --- a/files/fr/web/api/document/characterset/index.html +++ b/files/fr/web/api/document/characterset/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Document/characterSet ---{{ApiRef("DOM")}}
-Document.characterSet
propriété en lecture seule, renvoie l'encodage du document en cours. Un encodage décrit l'ensemble des caractères possibles et la façon de décoder les octets en ces caractères.
Document.characterSet
propriété en lecture seule, renvoie l'encodage du document en cours. Un encodage décrit l'ensemble des caractères possibles et la façon de décoder les octets en ces caractères.
Note : La propriété document.charset
et document.inputEncoding
sont les alias de document.characterSet
. Ne plus les utiliser.
{{ ApiRef("DOM") }}
-Indique si le document est affiché en mode dégradé (Quirks mode) ou dans le respect des standards.
+Indique si le document est affiché en mode dégradé (Quirks mode) ou dans le respect des standards.
-mode = document.compatMode@@ -20,7 +20,7 @@ translation_of: Web/API/Document/compatMode
"BackCompat"
si le document est a ffiché en mode "quirks" ; "BackCompat"
si le document est a ffiché en mode "quirks" ; "CSS1Compat"
si le document est affiché en mode "no-quirks" (aussi connu sous le nom de mode "standard") ou "limited-quirks" (mo de "proche du standard")."CSS1Compat"
si le document est affiché en mode "no-quirks" (aussi connu sous le nom de mode "standard") ou "limited-quirks" (mo de "proche du standard").Note : tous ces modes sont maintenant définis dans les normes, de sorte que les anciens «standards» et «presque standards» sont absurdes et ne sont plus utilisés dans les normes.
+Note : tous ces modes sont maintenant définis dans les normes, de sorte que les anciens «standards» et «presque standards» sont absurdes et ne sont plus utilisés dans les normes.
if (document.compatMode == "BackCompat") { // en mode Quirks }-
Renvoie le type MIME dans lequel le document est rendu. Il peut provenir d'en-têtes HTTP ou d'autres sources d'informations MIME et peut être affecté par les conversions automatiques de type effectuées par le navigateur ou les extensions.
-contentType = document.contentType;
contentType
est une propriété en lecture seule.
La propriété n'est pas affectée par les balises META.
-{{SpecName('DOM WHATWG','#dom-document-contenttype','Document.contenttype')}}
diff --git a/files/fr/web/api/document/createattribute/index.html b/files/fr/web/api/document/createattribute/index.html index fa0f93d1e0..bfec33bfa2 100644 --- a/files/fr/web/api/document/createattribute/index.html +++ b/files/fr/web/api/document/createattribute/index.html @@ -13,15 +13,15 @@ translation_of: Web/API/Document/createAttributeLa méthode Document.createAttribute()
crée un nouveau nœud d'attribut et le renvoie. L'objet a créé un noeud implémentant l'interface {{domxref("Attr")}}. Le DOM n'impose pas le type d'attribut à ajouter à un élément particulier de cette manière.
Note : La chaîne de caractères donnée dans le paramètre est convertie en minuscules.
+Note : La chaîne de caractères donnée dans le paramètre est convertie en minuscules.
attribut = document.createAttribute(nom)-
nom
est une chaîne de caractères contenant le nom de l'attribut.Spécification | diff --git a/files/fr/web/api/document/createcdatasection/index.html b/files/fr/web/api/document/createcdatasection/index.html index ea4fb083ea..f1a44c9a07 100644 --- a/files/fr/web/api/document/createcdatasection/index.html +++ b/files/fr/web/api/document/createcdatasection/index.html @@ -16,17 +16,17 @@ translation_of: Web/API/Document/createCDATASection
---|
Spécification | diff --git a/files/fr/web/api/document/documenturiobject/index.html b/files/fr/web/api/document/documenturiobject/index.html index 3c9f6fcb6f..cc5030a977 100644 --- a/files/fr/web/api/document/documenturiobject/index.html +++ b/files/fr/web/api/document/documenturiobject/index.html @@ -10,17 +10,17 @@ translation_of: Web/API/Document/documentURIObject ---||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -207,7 +207,7 @@ translation_of: Web/API/Document/drag_event
}, false);
document.addEventListener("drop", function( event ) {
- // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
+ // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
event.preventDefault();
// Déplace l'élément traîné vers la cible du drop sélectionnée
if ( event.target.className == "dropzone" ) {
diff --git a/files/fr/web/api/document/dragend_event/index.html b/files/fr/web/api/document/dragend_event/index.html
index ac2681db24..ce28cf1673 100644
--- a/files/fr/web/api/document/dragend_event/index.html
+++ b/files/fr/web/api/document/dragend_event/index.html
@@ -5,19 +5,19 @@ translation_of: Web/API/Document/dragend_event
---
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -163,33 +163,33 @@ translation_of: Web/API/Document/dragend_event
</style>
<script>
- var dragged;
+ var dragged;
- /* Les événements sont déclenchés sur les objets glissables */
+ /* Les événements sont déclenchés sur les objets glissables */
document.addEventListener("drag", function( event ) {
}, false);
document.addEventListener("dragstart", function( event ) {
- // Stocke une référence sur l'objet glissable
+ // Stocke une référence sur l'objet glissable
dragged = event.target;
- // transparence 50%
+ // transparence 50%
event.target.style.opacity = .5;
}, false);
document.addEventListener("dragend", function( event ) {
- // reset de la transparence
+ // reset de la transparence
event.target.style.opacity = "";
}, false);
- /* Les événements sont déclenchés sur les cibles du drop */
+ /* Les événements sont déclenchés sur les cibles du drop */
document.addEventListener("dragover", function( event ) {
- // Empêche default d'autoriser le drop
+ // Empêche default d'autoriser le drop
event.preventDefault();
}, false);
document.addEventListener("dragenter", function( event ) {
- // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
+ // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
if ( event.target.className == "dropzone" ) {
event.target.style.background = "purple";
}
@@ -197,7 +197,7 @@ translation_of: Web/API/Document/dragend_event
}, false);
document.addEventListener("dragleave", function( event ) {
- // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
+ // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
}
@@ -205,16 +205,16 @@ translation_of: Web/API/Document/dragend_event
}, false);
document.addEventListener("drop", function( event ) {
- // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
+ // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
event.preventDefault();
- // Déplace l'élément traîné vers la cible du drop sélectionnée
+ // Déplace l'élément traîné vers la cible du drop sélectionnée
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
dragged.parentNode.removeChild( dragged );
event.target.appendChild( dragged );
}
- }, false);
+ }, false);
</script>
diff --git a/files/fr/web/api/document/dragenter_event/index.html b/files/fr/web/api/document/dragenter_event/index.html
index 2bdc66e42e..7f95865724 100644
--- a/files/fr/web/api/document/dragenter_event/index.html
+++ b/files/fr/web/api/document/dragenter_event/index.html
@@ -7,19 +7,19 @@ translation_of: Web/API/Document/dragenter_event
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -165,33 +165,33 @@ translation_of: Web/API/Document/dragenter_event
</style>
<script>
- var dragged;
+ var dragged;
- /* Les événements sont déclenchés sur les objets glissables */
+ /* Les événements sont déclenchés sur les objets glissables */
document.addEventListener("drag", function( event ) {
}, false);
document.addEventListener("dragstart", function( event ) {
- // Stocke une référence sur l'objet glissable
+ // Stocke une référence sur l'objet glissable
dragged = event.target;
- // transparence 50%
+ // transparence 50%
event.target.style.opacity = .5;
}, false);
document.addEventListener("dragend", function( event ) {
- // reset de la transparence
+ // reset de la transparence
event.target.style.opacity = "";
}, false);
- /* Les événements sont déclenchés sur les cibles du drop */
+ /* Les événements sont déclenchés sur les cibles du drop */
document.addEventListener("dragover", function( event ) {
- // Empêche default d'autoriser le drop
+ // Empêche default d'autoriser le drop
event.preventDefault();
}, false);
document.addEventListener("dragenter", function( event ) {
- // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
+ // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
if ( event.target.className == "dropzone" ) {
event.target.style.background = "purple";
}
@@ -199,7 +199,7 @@ translation_of: Web/API/Document/dragenter_event
}, false);
document.addEventListener("dragleave", function( event ) {
- // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
+ // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
}
@@ -207,16 +207,16 @@ translation_of: Web/API/Document/dragenter_event
}, false);
document.addEventListener("drop", function( event ) {
- // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
+ // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
event.preventDefault();
- // Déplace l'élément traîné vers la cible du drop sélectionnée
+ // Déplace l'élément traîné vers la cible du drop sélectionnée
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
dragged.parentNode.removeChild( dragged );
event.target.appendChild( dragged );
}
- }, false);
+ }, false);
</script>
diff --git a/files/fr/web/api/document/dragleave_event/index.html b/files/fr/web/api/document/dragleave_event/index.html
index dfccbbc044..9221441d5f 100644
--- a/files/fr/web/api/document/dragleave_event/index.html
+++ b/files/fr/web/api/document/dragleave_event/index.html
@@ -9,7 +9,7 @@ translation_of: Web/API/Document/dragleave_event
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -163,33 +163,33 @@ translation_of: Web/API/Document/dragleave_event
</style>
<script>
- var dragged;
+ var dragged;
- /* Les événements sont déclenchés sur les objets glissables */
+ /* Les événements sont déclenchés sur les objets glissables */
document.addEventListener("drag", function( event ) {
}, false);
document.addEventListener("dragstart", function( event ) {
- // Stocke une référence sur l'objet glissable
+ // Stocke une référence sur l'objet glissable
dragged = event.target;
- // transparence 50%
+ // transparence 50%
event.target.style.opacity = .5;
}, false);
document.addEventListener("dragend", function( event ) {
- // reset de la transparence
+ // reset de la transparence
event.target.style.opacity = "";
}, false);
- /* Les événements sont déclenchés sur les cibles du drop */
+ /* Les événements sont déclenchés sur les cibles du drop */
document.addEventListener("dragover", function( event ) {
- // Empêche default d'autoriser le drop
+ // Empêche default d'autoriser le drop
event.preventDefault();
}, false);
document.addEventListener("dragenter", function( event ) {
- // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
+ // Met en surbrillance la cible de drop potentielle lorsque l'élément glissable y entre
if ( event.target.className == "dropzone" ) {
event.target.style.background = "purple";
}
@@ -197,7 +197,7 @@ translation_of: Web/API/Document/dragleave_event
}, false);
document.addEventListener("dragleave", function( event ) {
- // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
+ // reset de l'arrière-plan des potentielles cible du drop lorsque les éléments glissables les quittent
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
}
@@ -205,16 +205,16 @@ translation_of: Web/API/Document/dragleave_event
}, false);
document.addEventListener("drop", function( event ) {
- // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
+ // Empêche l'action par défaut (ouvrir comme lien pour certains éléments)
event.preventDefault();
- // Déplace l'élément traîné vers la cible du drop sélectionnée
+ // Déplace l'élément traîné vers la cible du drop sélectionnée
if ( event.target.className == "dropzone" ) {
event.target.style.background = "";
dragged.parentNode.removeChild( dragged );
event.target.appendChild( dragged );
}
- }, false);
+ }, false);
</script>
diff --git a/files/fr/web/api/document/dragover_event/index.html b/files/fr/web/api/document/dragover_event/index.html
index 86df0e5440..aca2e8a435 100644
--- a/files/fr/web/api/document/dragover_event/index.html
+++ b/files/fr/web/api/document/dragover_event/index.html
@@ -11,7 +11,7 @@ translation_of: Web/API/Document/dragover_event
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -138,86 +138,86 @@ translation_of: Web/API/Document/dragover_event
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
diff --git a/files/fr/web/api/document/drop_event/index.html b/files/fr/web/api/document/drop_event/index.html
index 68d66c8116..bb3c695f26 100644
--- a/files/fr/web/api/document/drop_event/index.html
+++ b/files/fr/web/api/document/drop_event/index.html
@@ -11,13 +11,13 @@ translation_of: Web/API/Document/drop_event
@@ -35,28 +35,28 @@ translation_of: Web/API/Document/drop_event
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
target {{readonlyInline}} |
- EventTarget |
+ EventTarget |
The element that was underneath the element being dragged. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
type {{readonlyInline}} |
- DOMString |
+ DOMString |
The type of event. | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
bubbles {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event normally bubbles or not | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
cancelable {{readonlyInline}} |
- Boolean |
+ Boolean |
Whether the event is cancellable or not? | |||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
view {{readonlyInline}} |
- WindowProxy |
- document.defaultView (window of the document) |
+ WindowProxy |
+ document.defaultView (window of the document) |
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
detail {{readonlyInline}} |
@@ -138,88 +138,86 @@ translation_of: Web/API/Document/drop_event
Renvoie un boxObject
(x, y, largeur, hauteur) pour un élément spécifié.
Note : Cette méthode est obsolète. Vous devez utiliser la méthode {{domxref("element.getBoundingClientRect()")}} à la place.
+boxObject = document.getBoxObjectFor(element);@@ -25,7 +27,7 @@ translation_of: Web/API/Document/getBoxObjectFor
element
est un {{domxref("element","DOMElement")}}var myDiv = document.getElementById("myDiv"), boxObj = document.getBoxObjectFor (myDiv); @@ -37,6 +39,6 @@ alert ( ", Height:" + boxObj.height );-
Spécifié dans nsIXULDocument.idl
+Spécifié dans nsIXULDocument.idl
diff --git a/files/fr/web/api/document/getelementbyid/index.html b/files/fr/web/api/document/getelementbyid/index.html index 74f004989b..eacf9ef0a2 100644 --- a/files/fr/web/api/document/getelementbyid/index.html +++ b/files/fr/web/api/document/getelementbyid/index.html @@ -16,7 +16,7 @@ translation_of: Web/API/Document/getElementByIdSi vous avez besoin d'accéder à un élément qui n'a pas d'ID, vous pouvez utiliser {{domxref("Document.querySelector","querySelector()")}} pour trouver l'élément en utilisant un {{Glossary("CSS selector","sélecteur")}}.
-var element = document.getElementById(id);@@ -25,41 +25,40 @@ translation_of: Web/API/Document/getElementById
id
L'ID (identifiant) de l'élément à localiser. Il est une chaîne de caractères sensible à la casse qui est unique ; un seul élément peut avoir un ID donné.
Un objet {{domxref("Element")}} décrivant l'objet élément du DOM correspondant à l'ID spécifié ou null
si aucun n'a été trouvé dans le document.
<html>
-<head>
- <title>getElementById example</title>
-</head>
-<body>
- <p id="para">Some text here</p>
- <button onclick="changeColor('blue');">blue</button>
- <button onclick="changeColor('red');">red</button>
-</body>
-</html>
+<html> +<head> + <title>getElementById example</title> +</head> +<body> + <p id="para">Some text here</p> + <button onclick="changeColor('blue');">blue</button> + <button onclick="changeColor('red');">red</button> +</body> +</html>
function changeColor(newColor) {
- var elem = document.getElementById('para');
- elem.style.color = newColor;
-}
+function changeColor(newColor) { + var elem = document.getElementById('para'); + elem.style.color = newColor; +}-
{{ EmbedLiveSample('Example1', 250, 100) }}
-L'écriture de la lettre capitale de « Id » dans le nom de cette méthode doit être respectée pour que le code fonctionne ; getElementByID()
n'est pas valide et ne fonctionnera pas, même si elle semble naturelle.
+<!doctype html> -<html> -<head> - <meta charset="UTF-8"> - <title>Document</title> -</head> -<body> - <div id="parent-id"> - <p>hello word1</p> - <p id="test1">hello word2</p> - <p>hello word3</p> - <p>hello word4</p> - </div> - <script> - var parentDOM = document.getElementById('parent-id'); - var test1=parentDOM.getElementById('test1'); - //
erreur de lancement- //
TypeError inattendu : parentDOM.getElementById n'est pas une fonction- </script> -</body> -</html>
<!doctype html> +<html> +<head> + <meta charset="UTF-8"> + <title>Document</title> +</head> +<body> + <div id="parent-id"> + <p>hello word1</p> + <p id="test1">hello word2</p> + <p>hello word3</p> + <p>hello word4</p> + </div> + <script> + var parentDOM = document.getElementById('parent-id'); + var test1=parentDOM.getElementById('test1'); + //erreur de lancement + //TypeError inattendu : parentDOM.getElementById n'est pas une fonction + </script> +</body> +</html>
S'il n'y a pas d'élément avec l'id
fourni, cette fonction retourne null
. A noter que le paramètre id
est sensible à la casse, ainsi document.getElementById("Main")
retournera null
au lieu de l'élément <div id="main">
étant donné que "M" et "m" sont différents pour cette méthode.
Les éléments absents du document ne sont pas cherchés par getElementById()
. Quand vous créez un élément et y assignez un ID, vous devez insérer l'élément dans l'arbre du document avec {{domxref("Node.insertBefore()")}} ou une méthode similaire avant de pouvoir y accéder avec getElementById()
:
var element = document.createElement('div');
-element.id = 'testqq';
-var el = document.getElementById('testqq'); // el vaudra null !
+var element = document.createElement('div'); +element.id = 'testqq'; +var el = document.getElementById('testqq'); // el vaudra null !-
Les documents non-HTML. Les implémentations du DOM doivent avoir une information qui précise quels attributs sont de type ID. Un attribut portant le nom « id » n'est pas de type ID tant qu'il n'a pas été explicitement défini ainsi (dans la DTD du document). L'attribut id
est défini comme étant de type ID dans les langages courants comme XHTML ou XUL. Les implémentations ne sachant pas déterminer si les attributs sont de type ID ou non sont supposées renvoyer null
.
Les documents non-HTML. Les implémentations du DOM doivent avoir une information qui précise quels attributs sont de type ID. Un attribut portant le nom « id » n'est pas de type ID tant qu'il n'a pas été explicitement défini ainsi (dans la DTD du document). L'attribut id
est défini comme étant de type ID dans les langages courants comme XHTML ou XUL. Les implémentations ne sachant pas déterminer si les attributs sont de type ID ou non sont supposées renvoyer null
.
Traduction en français (non normative) : getElementById
+Traduction en français (non normative) : getElementById
'div.myclass'
{{APIRef("DOM")}}
-Renvoie un objet de type tableau de tous les éléments enfants qui ont tous les noms de classe donnés. Lorsqu'il est appelé sur l'objet document, le document complet est recherché, y compris le nœud racine. Vous pouvez également appeler {{domxref ("Element.getElementsByClassName", "getElementsByClassName ()")}} sur n'importe quel élément; il retournera uniquement les éléments qui sont les descendants de l'élément racine spécifié avec les noms de classes donnés.
+Renvoie un objet de type tableau de tous les éléments enfants qui ont tous les noms de classe donnés. Lorsqu'il est appelé sur l'objet document, le document complet est recherché, y compris le nœud racine. Vous pouvez également appeler {{domxref ("Element.getElementsByClassName", "getElementsByClassName ()")}} sur n'importe quel élément; il retournera uniquement les éléments qui sont les descendants de l'élément racine spécifié avec les noms de classes donnés.
-var elements = document.getElementsByClassName(names); // or: var elements = rootElement.getElementsByClassName(names);
Trouve tous les éléments ayant la classe « test » :
@@ -40,43 +40,43 @@ translation_of: Web/API/Document/getElementsByClassNamedocument.getElementById('main').getElementsByClassName('test')-
Nous pouvons également utiliser les méthodes de Array.prototype sur toute {{domxref ("HTMLCollection")}} en passant HTMLCollection comme valeur de la méthode. Ici, nous allons trouver tous les éléments div qui ont une classe de 'test':
+Nous pouvons également utiliser les méthodes de Array.prototype sur toute {{domxref ("HTMLCollection")}} en passant HTMLCollection comme valeur de la méthode. Ici, nous allons trouver tous les éléments div qui ont une classe de 'test':
-var testElements = document.getElementsByClassName('test');
-var testDivs = Array.prototype.filter.call(testElements, function(testElement){
- return testElement.nodeName === 'DIV';
-});
+var testElements = document.getElementsByClassName('test'); +var testDivs = Array.prototype.filter.call(testElements, function(testElement){ + return testElement.nodeName === 'DIV'; +});-
XXX writeme == Notes == Une méthode semblable existe pour <code>Element</code>
+XXX writeme == Notes == Une méthode semblable existe pour <code>Element</code>
-C'est la méthode d'opération la plus couramment utilisée.
+C'est la méthode d'opération la plus couramment utilisée.
-<!doctype html>
-<html>
-<head>
- <meta charset="UTF-8">
- <title>Document</title>
-</head>
-<body>
- <div id="parent-id">
- <p>hello word1</p>
- <p class="test">hello word2</p>
- <p >hello word3</p>
- <p>hello word4</p>
- </div>
- <script>
- var parentDOM = document.getElementById("parent-id");
+<!doctype html>
+<html>
+<head>
+ <meta charset="UTF-8">
+ <title>Document</title>
+</head>
+<body>
+ <div id="parent-id">
+ <p>hello word1</p>
+ <p class="test">hello word2</p>
+ <p >hello word3</p>
+ <p>hello word4</p>
+ </div>
+ <script>
+ var parentDOM = document.getElementById("parent-id");
- var test=parentDOM.getElementsByClassName("test");//test is not target element
- console.log(test);//HTMLCollection[1]
+ var test=parentDOM.getElementsByClassName("test");//test is not target element
+ console.log(test);//HTMLCollection[1]
- var testTarget=parentDOM.getElementsByClassName("test")[0];//here , this element is target
- console.log(testTarget);//<p class="test">hello word2</p>
-
</script>
-</body>
-</html>
+ var testTarget=parentDOM.getElementsByClassName("test")[0];//here , this element is target
+ console.log(testTarget);//<p class="test">hello word2</p>
+ </script>
+</body>
+</html>
Renvoie une liste des éléments portant un {{domxref("element.name","name")}} donné dans le document (X)HTML.
-elements = document.getElementsByName(name)@@ -23,36 +23,36 @@ translation_of: Web/API/Document/getElementsByName
name
est la valeur de l'attribut name
des éléments.<!DOCTYPE html>
-<html lang="en">
-<head>
+<!DOCTYPE html>
+<html lang="en">
+<head>
...
-</head>
+</head>
-<body>
-<form name="up"><input type="text"></form>
-<div name="down"><input type="text"></div>
+<body>
+<form name="up"><input type="text"></form>
+<div name="down"><input type="text"></div>
-<script>
-var up_forms = document.getElementsByName("up");
-console.log(up_forms[0].tagName); // retourne "FORM"
-</script>
-</body>
-</html>
+<script>
+var up_forms = document.getElementsByName("up");
+console.log(up_forms[0].tagName); // retourne "FORM"
+</script>
+</body>
+</html>
-L'attribut name
est uniquement applicable aux documents (X) HTML. La méthode renvoie une collection {{domxref("NodeList")}} en cours qui contient tous les éléments avec une valeur donnée pour l'attribut name, tels que {{htmlelement("meta")}} ou {{htmlelement("object")}} ou même si le nom est placé sur des éléments qui ne supportent pas du tout un attribut name
.
L'attribut name
est uniquement applicable aux documents (X) HTML. La méthode renvoie une collection {{domxref("NodeList")}} en cours qui contient tous les éléments avec une valeur donnée pour l'attribut name, tels que {{htmlelement("meta")}} ou {{htmlelement("object")}} ou même si le nom est placé sur des éléments qui ne supportent pas du tout un attribut name
.
La méthode getElementsByName fonctionne différemment dans différents navigateurs. Dans IE <10, la méthode getElementsByName () renvoie également les éléments qui ont un attribut id avec la valeur spécifiée. Vous devriez donc faire attention à ne pas utiliser la même chaîne pour le nom et l'identifiant.
+La méthode getElementsByName fonctionne différemment dans différents navigateurs. Dans IE <10, la méthode getElementsByName () renvoie également les éléments qui ont un attribut id avec la valeur spécifiée. Vous devriez donc faire attention à ne pas utiliser la même chaîne pour le nom et l'identifiant.
-Renvoie une {{domxref ("HTMLCollection")}} des éléments avec le nom de balise donné. Le document complet est recherché, y compris le nœud racine. Le HTMLCollection
renvoyée est en direct, ce qui signifie qu'elle se met à jour automatiquement pour rester synchronisée avec l'arborescence DOM sans avoir à rappeler document.getElementsByTagName ().
Renvoie une {{domxref ("HTMLCollection")}} des éléments avec le nom de balise donné. Le document complet est recherché, y compris le nœud racine. Le HTMLCollection
renvoyée est en direct, ce qui signifie qu'elle se met à jour automatiquement pour rester synchronisée avec l'arborescence DOM sans avoir à rappeler document.getElementsByTagName ().
var elements = document.getElementsByTagName(name);@@ -27,79 +27,79 @@ translation_of: Web/API/Document/getElementsByTagName
Note : La dernière spécification W3C dit que elements
est une HTMLCollection
; cependant cette méthode renvoie une {{domxref("NodeList")}} dans les navigateurs WebKit. Voir {{bug(14869)}} pour plus de détails.
Dans l'exemple suivant, getElementsByTagName()
commence à partir d'un élément parent particulier et effectue une recherche descendante récursive dans le DOM à partir de cet élément parent, en créant une collection de tous les éléments descendants qui correspondent au paramètre de name
. Cela démontre à la fois document.getElementsByTagName()
et son homologue {{domxref ("Element.getElementsByTagName ()")}}, qui lance la recherche sur un élément spécifique dans l'arbre DOM.
Cliquer sur les boutons utilise getElementsByTagName()
pour compter les éléments de paragraphe descendant d'un parent particulier (le document lui-même ou l'un des éléments {{HTMLElement ("div")}} imbriqués).
<!DOCTYPE html>
-<html lang="en">
-<head>
- <meta charset="UTF-8" />
- <title>getElementsByTagName example</title>
- <script>
- function getAllParaElems() {
- var allParas = document.getElementsByTagName('p');
- var num = allParas.length;
- alert('There are ' + num + ' paragraph in this document');
- }
-
- function div1ParaElems() {
- var div1 = document.getElementById('div1');
- var div1Paras = div1.getElementsByTagName('p');
- var num = div1Paras.length;
- alert('There are ' + num + ' paragraph in #div1');
- }
-
- function div2ParaElems() {
- var div2 = document.getElementById('div2');
- var div2Paras = div2.getElementsByTagName('p');
- var num = div2Paras.length;
- alert('There are ' + num + ' paragraph in #div2');
- }
- </script>
-</head>
-<body style="border: solid green 3px">
- <p>Some outer text</p>
- <p>Some outer text</p>
-
- <div id="div1" style="border: solid blue 3px">
- <p>Some div1 text</p>
- <p>Some div1 text</p>
- <p>Some div1 text</p>
-
- <div id="div2" style="border: solid red 3px">
- <p>Some div2 text</p>
- <p>Some div2 text</p>
- </div>
- </div>
-
- <p>Some outer text</p>
- <p>Some outer text</p>
-
- <button onclick="getAllParaElems();">
- show all p elements in document</button><br />
-
- <button onclick="div1ParaElems();">
- show all p elements in div1 element</button><br />
-
- <button onclick="div2ParaElems();">
- show all p elements in div2 element</button>
-
-</body>
-</html>
-
-Lorsqu'elle est appelée sur un document HTML, Dans l'exemple suivant, Cliquer sur les boutons utilise Lorsqu'elle est appelée sur un document HTML, getElementsByTagName()
classe son argument avant de continuer. Cela n'est pas souhaitable lorsque vous essayez de faire correspondre des éléments camelCase SVG dans un sous-arbre dans un document HTML. {{Domxref ("document.getElementsByTagNameNS ()")}} est utile dans ce cas. Voir aussi {{Bug (499656)}}.
+Exemple
+
+getElementsByTagName()
commence à partir d'un élément parent particulier et effectue une recherche descendante récursive dans le DOM à partir de cet élément parent, en créant une collection de tous les éléments descendants qui correspondent au paramètre de name
. Cela démontre à la fois document.getElementsByTagName()
et son homologue {{domxref ("Element.getElementsByTagName ()")}}, qui lance la recherche sur un élément spécifique dans l'arbre DOM.getElementsByTagName()
pour compter les éléments de paragraphe descendant d'un parent particulier (le document lui-même ou l'un des éléments {{HTMLElement ("div")}} imbriqués).<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8" />
+ <title>getElementsByTagName example</title>
+ <script>
+ function getAllParaElems() {
+ var allParas = document.getElementsByTagName('p');
+ var num = allParas.length;
+ alert('There are ' + num + ' paragraph in this document');
+ }
+
+ function div1ParaElems() {
+ var div1 = document.getElementById('div1');
+ var div1Paras = div1.getElementsByTagName('p');
+ var num = div1Paras.length;
+ alert('There are ' + num + ' paragraph in #div1');
+ }
+
+ function div2ParaElems() {
+ var div2 = document.getElementById('div2');
+ var div2Paras = div2.getElementsByTagName('p');
+ var num = div2Paras.length;
+ alert('There are ' + num + ' paragraph in #div2');
+ }
+ </script>
+</head>
+<body style="border: solid green 3px">
+ <p>Some outer text</p>
+ <p>Some outer text</p>
+
+ <div id="div1" style="border: solid blue 3px">
+ <p>Some div1 text</p>
+ <p>Some div1 text</p>
+ <p>Some div1 text</p>
+
+ <div id="div2" style="border: solid red 3px">
+ <p>Some div2 text</p>
+ <p>Some div2 text</p>
+ </div>
+ </div>
+
+ <p>Some outer text</p>
+ <p>Some outer text</p>
+
+ <button onclick="getAllParaElems();">
+ show all p elements in document</button><br />
+
+ <button onclick="div1ParaElems();">
+ show all p elements in div1 element</button><br />
+
+ <button onclick="div2ParaElems();">
+ show all p elements in div2 element</button>
+
+</body>
+</html>
+
+Notes
+
+getElementsByTagName()
classe son argument avant de continuer. Cela n'est pas souhaitable lorsque vous essayez de faire correspondre des éléments camelCase SVG dans un sous-arbre dans un document HTML. {{Domxref ("document.getElementsByTagNameNS ()")}} est utile dans ce cas. Voir aussi {{Bug (499656)}}.
- document.getElementsByTagName()
est similaire à {{domxref ("element.getElementsByTagName ()")}}, sauf que sa recherche englobe tout le document.
document.getElementsByTagName()
est similaire à {{domxref ("element.getElementsByTagName ()")}}, sauf que sa recherche englobe tout le document.
-Renvoie une liste d'éléments avec la balise de nom donnée appartenant à l'espace de noms donné. Le document complet est recherché, y compris le noeud racine.
-elements = document.getElementsByTagNameNS(namespace,name)
elements
est une {{domxref("NodeList")}} (liste de noeud) directe (mais voir le note ci-dessous) d'éléments trouvés dans l'ordre de leur apparition dans l'arbre.namespace
l'URI d'espace de noms des éléments à rechercher (voir element.namespaceURI
).name
est, soit le nom local des éléments à rechercher, soit la valeur spéciale "*"
pour tous les éléments (voir element.localName
).namespace
l'URI d'espace de noms des éléments à rechercher (voir element.namespaceURI
).name
est, soit le nom local des éléments à rechercher, soit la valeur spéciale "*"
pour tous les éléments (voir element.localName
).elements
sont des NodeList
, cette méthode renvoie une {{domxref("HTMLCollection")}} dans Gecko et Internet Explorer. Opera retourne une NodeList
, mais avec une méthode implémentée namedItem
, ce qui la rend similaire à une HTMLCollection
. À partir de Janvier 2012, dans les navigateurs WebKit seulement, la valeur retournée est une pure NodeList
. Voir bug 14869 pour plus de détails.Note : Tandis que la spécification W3C indique que les elements
sont des NodeList
, cette méthode renvoie une {{domxref("HTMLCollection")}} dans Gecko et Internet Explorer. Opera retourne une NodeList
, mais avec une méthode implémentée namedItem
, ce qui la rend similaire à une HTMLCollection
. À partir de Janvier 2012, dans les navigateurs WebKit seulement, la valeur retournée est une pure NodeList
. Voir bug 14869 pour plus de détails.
Dans l'exemple suivant, getElementsByTagNameNS
commence à partir d'un élément parent particulier et cherche dans le DOM récursivement de haut en bas à partir de cet élément parent, les éléments enfants correspondant au paramètre name
de la balise.
Notez que lorsque le noeud sur lequel getElementsByTagName
est invoqué n'est pas un noeud document
, la méthode element.getElementsByTagNameNS est en fait utilisée.
Notez que lorsque le noeud sur lequel getElementsByTagName
est invoqué n'est pas un noeud document
, la méthode element.getElementsByTagNameNS est en fait utilisée.
Pour utiliser l'exemple suivant, il suffit de le copier/coller dans un nouveau fichier enregistré avec l'extension .xhtml.
-<html xmlns="http://www.w3.org/1999/xhtml"> +http://www.w3.org/1999/xhtml"> <head> <title>getElementsByTagNameNS example</title> @@ -46,7 +48,7 @@ translation_of: Web/API/Document/getElementsByTagNameNS function getAllParaElems() { - var allParas = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); + var allParas = document.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); var num = allParas.length; @@ -57,7 +59,7 @@ function getAllParaElems() function div1ParaElems() { var div1 = document.getElementById("div1") - var div1Paras = div1.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); + var div1Paras = div1.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); var num = div1Paras.length; @@ -68,7 +70,7 @@ function div1ParaElems() function div2ParaElems() { var div2 = document.getElementById("div2") - var div2Paras = div2.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); + var div2Paras = div2.getElementsByTagNameNS("http://www.w3.org/1999/xhtml", "p"); var num = div2Paras.length; @@ -109,9 +111,9 @@ function div2ParaElems() </html>-Solution de contournement potentielle pour les navigateurs qui ne prennent pas en charge XPath
+Solution de contournement potentielle pour les navigateurs qui ne prennent pas en charge XPath
-Si le navigateur souhaité ne supporte pas XPath, une autre approche (comme traverser le DOM à travers tous ses enfants, identifier toutes les instances de @xmlns, etc.) serait nécessaire pour trouver toutes les balises avec le nom local et l'espace de noms, mais XPath est beaucoup plus rapide. (Pour adapter à Explorer, on pourrait appeler un wrapper XPath au lieu du XPath dans la fonction ci-dessous (comme Explorer supporte XPath avec une API différente), comme cette classe wrapper.)
+Si le navigateur souhaité ne supporte pas XPath, une autre approche (comme traverser le DOM à travers tous ses enfants, identifier toutes les instances de @xmlns, etc.) serait nécessaire pour trouver toutes les balises avec le nom local et l'espace de noms, mais XPath est beaucoup plus rapide. (Pour adapter à Explorer, on pourrait appeler un wrapper XPath au lieu du XPath dans la fonction ci-dessous (comme Explorer supporte XPath avec une API différente), comme cette classe wrapper.)
function getElementsByTagNameNSWrapper (ns, elName, doc, context) { if (!doc) { @@ -131,6 +133,6 @@ function div2ParaElems() }-Spécifications
+Spécifications
-DOM Level 2 Core: Document.getElementsByTagNameNS
+DOM Level 2 Core: Document.getElementsByTagNameNS
diff --git a/files/fr/web/api/document/getselection/index.html b/files/fr/web/api/document/getselection/index.html index 676ba4d351..e485df22ae 100644 --- a/files/fr/web/api/document/getselection/index.html +++ b/files/fr/web/api/document/getselection/index.html @@ -13,4 +13,4 @@ original_slug: Web/API/DocumentOrShadowRoot/getSelection ---{{APIRef("DOM")}}
-Cette méthode fonctionne de manière identique à la méthode {{domxref ("Window.getSelection()")}} ; elle renvoie un objet {{domxref ("Selection")}} représentant le texte actuellement sélectionné dans le document.
+Cette méthode fonctionne de manière identique à la méthode {{domxref ("Window.getSelection()")}} ; elle renvoie un objet {{domxref ("Selection")}} représentant le texte actuellement sélectionné dans le document.
diff --git a/files/fr/web/api/document/hasfocus/index.html b/files/fr/web/api/document/hasfocus/index.html index f33a56bb10..fb6088c0a9 100644 --- a/files/fr/web/api/document/hasfocus/index.html +++ b/files/fr/web/api/document/hasfocus/index.html @@ -11,59 +11,59 @@ translation_of: Web/API/Document/hasFocus ---{{ ApiRef() }}
-La méthode
+Document.hasFocus()
retourne une valeur {{jsxref("Boolean")}}true
(vrai) indiquant si le document ou tout élément à l'intérieur du document a le focus. Cette méthode peut être utilisée pour déterminer si l'élément actif d'un document a le focus.La méthode
Document.hasFocus()
retourne une valeur {{jsxref("Boolean")}}true
(vrai) indiquant si le document ou tout élément à l'intérieur du document a le focus. Cette méthode peut être utilisée pour déterminer si l'élément actif d'un document a le focus.--Note : Lors de la visualisation d'un document, un élément avec focus est toujours l'élément actif dans le document, mais un élément actif n'a pas nécessairement le focus. Par exemple, un élément actif dans une fenêtre contextuelle qui n'est pas le premier plan n'a pas de focus.
+Note : Lors de la visualisation d'un document, un élément avec focus est toujours l'élément actif dans le document, mais un élément actif n'a pas nécessairement le focus. Par exemple, un élément actif dans une fenêtre contextuelle qui n'est pas le premier plan n'a pas de focus.
Syntaxe
+Syntaxe
focused = document.hasFocus();-Valeur retournée
+Valeur retournée
-
false
(faux) si l'élément actif dans le document n'a pas de focus ;true
(vrai) si l'élément actif dans le document a le focus.Exemple
- -+<!DOCTYPE html> -<html lang="en"> -<head> -<meta charset="UTF-8" /> -<title>TEST</title> -<style> -#message { font-weight: bold; } -</style> -<script> -setInterval( checkPageFocus, 200 ); - -function checkPageFocus() { - var info = document.getElementById("message"); - - if ( document.hasFocus() ) { - info.innerHTML = "The document has the focus."; - } else { - info.innerHTML = "The document doesn't have the focus."; - } -} - -function openWindow() { - window.open ( - "http://developer.mozilla.org/", - "mozdev", - "width=640,height=300,left=150,top=260" - ); -} -</script> -</head> -<body> - <h1>JavaScript hasFocus example</h1> - <div id="message">Waiting for user action</div> - <div><button onclick="openWindow()">Open a new window</button></div> -</body> -</html>
Exemple
+ +<!DOCTYPE html> +<html lang="en"> +<head> +<meta charset="UTF-8" /> +<title>TEST</title> +<style> +#message { font-weight: bold; } +</style> +<script> +setInterval( checkPageFocus, 200 ); + +function checkPageFocus() { + var info = document.getElementById("message"); + + if ( document.hasFocus() ) { + info.innerHTML = "The document has the focus."; + } else { + info.innerHTML = "The document doesn't have the focus."; + } +} + +function openWindow() { + window.open ( + "https://developer.mozilla.org/", + "mozdev", + "width=640,height=300,left=150,top=260" + ); +} +</script> +</head> +<body> + <h1>JavaScript hasFocus example</h1> + <div id="message">Waiting for user action</div> + <div><button onclick="openWindow()">Open a new window</button></div> +</body> +</html>Spécification
diff --git a/files/fr/web/api/document/head/index.html b/files/fr/web/api/document/head/index.html index 9927db3f3b..ef80950d76 100644 --- a/files/fr/web/api/document/head/index.html +++ b/files/fr/web/api/document/head/index.html @@ -7,16 +7,15 @@ tags: - HTML5 translation_of: Web/API/Document/head --- -Résumé
Retourne l'élément {{HTMLElement("head")}} du document courant. S'il y a plus d'un élément <head>, le premier est retourné.
-Syntaxe
+Syntaxe
var objRef = document.head;-Exemple
+Exemple
// en HTML: <head id="my-document-head"> var aHead = document.head; @@ -26,7 +25,7 @@ alert(aHead.id); // "my-document-head"; alert( document.head === document.querySelector("head") ); // true-Notes
+Notes
diff --git a/files/fr/web/api/document/height/index.html b/files/fr/web/api/document/height/index.html index 8f69f2dbbc..6dbe1f47e8 100644 --- a/files/fr/web/api/document/height/index.html +++ b/files/fr/web/api/document/height/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Document/height
document.head
est en lecture seule. Essayer d'assigner une valeur à cettre propriété échouera en silence ou lancera uneTypeError
si le mode strict d'ECMAScript est activé dans un navigateur Gecko.Retourne la hauteur de l'objet {{domxref("document")}}. Dans la plupart des cas, ceci est égal à l'élément {{HTMLElement("body")}} du document courant.
-Syntaxe
+Syntaxe
height_value = document.heightdiff --git a/files/fr/web/api/document/images/index.html b/files/fr/web/api/document/images/index.html index 56ae7fba48..1b127eb980 100644 --- a/files/fr/web/api/document/images/index.html +++ b/files/fr/web/api/document/images/index.html @@ -6,23 +6,28 @@ tags: translation_of: Web/API/Document/images ---{{ ApiRef() }}
-Résumé
--
document.images
renvoie une collection des images du document HTML courant.Syntaxe
-HTMLCollection = document.images --Exemple
-var listeimg = document.images; + ++ +
document.images
renvoie une collection des images du document HTML courant.Syntaxe
+ +HTMLCollection =document.images+ +Exemple
+ +var listeimg = document.images; for(var i = 0; i < listeimg.length; i++) { if(listeimg[i] == "banner.gif") { // l'image banner a été trouvée } }-Notes
--
document.images
fait partie du DOM HTML, et fonctionne uniquement pour les document HTML.Spécification
+ +Notes
+ ++
document.images
fait partie du DOM HTML, et fonctionne uniquement pour les document HTML.Spécification
var modName = "HTML";
-var modVer = "2.0";
-var conformTest = document.implementation.hasFeature( modName, modVer );
+var modName = "HTML";
+var modVer = "2.0";
+var conformTest = document.implementation.hasFeature( modName, modVer );
-alert( "DOM " + modName + " " + modVer + " supported?: " + conformTest );
+alert( "DOM " + modName + " " + modVer + " supported?: " + conformTest );
-// alerte avec : "DOM HTML 2.0 pris en charge ?: true" si le module DOM niveau 2 HTML est pris en charge.
+// alerte avec : "DOM HTML 2.0 pris en charge ?: true" si le module DOM niveau 2 HTML est pris en charge.
-Une liste de noms de modules (par exemple, Core, HTML, XML, etc.) est disponible dans la Conformance Section DOM niveau 2.
+Une liste de noms de modules (par exemple, Core, HTML, XML, etc.) est disponible dans la Conformance Section DOM niveau 2.
-La recommandation DOM niveau 1 du W3C ne spécifiait que la méthode hasFeature
, qui est un moyen de déterminer si un module DOM est supporté par un navigateur (voir l'exemple ci-dessus et ce que votre agent utilisateur prétend prendre en charge ?). Si disponibles, d'autres méthodes DOMImplementation
fournissent des services pour contrôler des choses en dehors d'un document unique. Par exemple, l'interface DOMImplementation
inclut une méthode createDocumentType
avec laquelle des DTD peuvent être créées pour un ou plusieurs documents gérés par l'implémentation.
La recommandation DOM niveau 1 du W3C ne spécifiait que la méthode hasFeature
, qui est un moyen de déterminer si un module DOM est supporté par un navigateur (voir l'exemple ci-dessus et ce que votre agent utilisateur prétend prendre en charge ?). Si disponibles, d'autres méthodes DOMImplementation
fournissent des services pour contrôler des choses en dehors d'un document unique. Par exemple, l'interface DOMImplementation
inclut une méthode createDocumentType
avec laquelle des DTD peuvent être créées pour un ou plusieurs documents gérés par l'implémentation.
{{APIRef("DOM")}}
-La méthode {{domxref ("Document")}} importNode()
crée une nouvelle copie du {{domxref ("Node")}} ou {{domxref ("DocumentFragment")}} spécifié à partir d'un autre document, afin qu'il puisse être inséré dans le document actuel. Il n'est pas encore inclus dans l'arbre des documents; Pour ce faire, vous devez appeler une méthode telle que {{domxref ("Node.appendChild", "appendChild ()")}} ou {{domxref ("Node.insertBefore", "insertBefore ()")}}.
La méthode {{domxref ("Document")}} importNode()
crée une nouvelle copie du {{domxref ("Node")}} ou {{domxref ("DocumentFragment")}} spécifié à partir d'un autre document, afin qu'il puisse être inséré dans le document actuel. Il n'est pas encore inclus dans l'arbre des documents; Pour ce faire, vous devez appeler une méthode telle que {{domxref ("Node.appendChild", "appendChild ()")}} ou {{domxref ("Node.insertBefore", "insertBefore ()")}}.
var node = document.importNode(externalNode, deep);
externalNode
Node
ou DocumentFragment
à importer dans le document courant. Après l'importation, le nouveau parentNode
du noeud est null
, car il n'a pas encore été inséré dans l'arborescence du document.Node
ou DocumentFragment
à importer dans le document courant. Après l'importation, le nouveau parentNode
du noeud est null
, car il n'a pas encore été inséré dans l'arborescence du document.deep
externalNode
. Si ce paramètre est true
(vrai), alors externalNode
et tous ses descendants sont copiés; si false
(faux), seul le nœud unique, externalNode
, est importé.externalNode
. Si ce paramètre est true
(vrai), alors externalNode
et tous ses descendants sont copiés; si false
(faux), seul le nœud unique, externalNode
, est importé.Note : Dans la spécification DOM4, Note : Dans la spécification DOM4, deep
est répertorié en tant qu'argument facultatif. S'il est omis, la méthode agit comme si la valeur de deep
était true
, par défaut, elle utilisait le clonage profond comme comportement par défaut. Pour créer un clone superficiel, la profondeur doit être définie sur false
.
+deep
est répertorié en tant qu'argument facultatif. S'il est omis, la méthode agit comme si la valeur de deep
était true
, par défaut, elle utilisait le clonage profond comme comportement par défaut. Pour créer un clone superficiel, la profondeur doit être définie sur false
.
- Ce comportement a été modifié dans la dernière spécification, et s'il est omis, la méthode agira comme si la valeur de deep
était false
. Bien que ce soit toujours facultatif, vous devriez toujours fournir l'argument deep
à la fois pour la compatibilité en amont et en aval. Avec Gecko 28.0 {{geckoRelease (28)}}, la console a averti les développeurs de ne pas omettre l'argument. À partir de Gecko 29.0 {{geckoRelease (29)}}), un clone superficiel est défini par défaut au lieu d'un clone profond.
deep
était false
. Bien que ce soit toujours facultatif, vous devriez toujours fournir l'argument deep
à la fois pour la compatibilité en amont et en aval. Avec Gecko 28.0 {{geckoRelease (28)}}, la console a averti les développeurs de ne pas omettre l'argument. À partir de Gecko 29.0 {{geckoRelease (29)}}), un clone superficiel est défini par défaut au lieu d'un clone profond.
var iframe = document.getElementsByTagName("iframe")[0];
-var oldNode = iframe.contentWindow.document.getElementById("myNode");
-var newNode = document.importNode(oldNode, true);
-document.getElementById("container").appendChild(newNode);
+var iframe = document.getElementsByTagName("iframe")[0]; +var oldNode = iframe.contentWindow.document.getElementById("myNode"); +var newNode = document.importNode(oldNode, true); +document.getElementById("container").appendChild(newNode);-
Le noeud d'origine n'est pas supprimé du document d'origine. Le noeud importé est un clone de l'original.
+Le noeud d'origine n'est pas supprimé du document d'origine. Le noeud importé est un clone de l'original.
-
Les nœuds provenant de documents externes doivent être clonés à l'aide de document.importNode()
(ou adoptés avec document.adoptNode()
) avant de pouvoir être insérés dans le document courant. Pour en savoir plus sur les problèmes de Node.ownerDocument
, consultez la FAQ DOM du W3C (en anglais).
Les nœuds provenant de documents externes doivent être clonés à l'aide de document.importNode()
(ou adoptés avec document.adoptNode()
) avant de pouvoir être insérés dans le document courant. Pour en savoir plus sur les problèmes de Node.ownerDocument
, consultez la FAQ DOM du W3C (en anglais).
Gecko n'obligeait pas à utiliser document.importNode()
et document.adoptNode()
avant sa version 1.9. Depuis les versions 1.9 alphas, si un nœud n'est pas adopté ou importé avant d'être utilisé dans un autre document, l'exception WRONG_DOCUMENT_ERR
est déclenchée (NS_ERROR_DOM_WRONG_DOCUMENT_ERR
). implémentation dans le bug 47903.
Gecko n'obligeait pas à utiliser document.importNode()
et document.adoptNode()
avant sa version 1.9. Depuis les versions 1.9 alphas, si un nœud n'est pas adopté ou importé avant d'être utilisé dans un autre document, l'exception WRONG_DOCUMENT_ERR
est déclenchée (NS_ERROR_DOM_WRONG_DOCUMENT_ERR
). implémentation dans le bug 47903.
-
Spécifications | @@ -110,12 +110,8 @@ document.addEventListener('readystatechange', bootstrap, false);
---|
Note : Sur iOS UIWebViews, les évènements scroll
ne sont pas émis pendant le défilement, mais une fois que celui-ci est terminé. Voir Bootstrap issue #16202. Safari et WKWebViews ne sont pas affectés par ce bogue.
Note : Sur iOS UIWebViews, les évènements scroll
ne sont pas émis pendant le défilement, mais une fois que celui-ci est terminé. Voir Bootstrap issue #16202. Safari et WKWebViews ne sont pas affectés par ce bogue.
Notez, cependant, que les évènements d’interface utilisateur et les frames d’animation sont émises à peu près à la même fréquence, et ainsi l’optimisation qui suit est souvent superflue. Cet exemple optimise l’évènement scroll
avec requestAnimationFrame
.
// Référence: http://www.html5rocks.com/en/tutorials/speed/animations/ +// Référence: http://www.html5rocks.com/en/tutorials/speed/animations/ var derniere_position_de_scroll_connue = 0; var ticking = false; diff --git a/files/fr/web/api/document/selectedstylesheetset/index.html b/files/fr/web/api/document/selectedstylesheetset/index.html index 8c66beecb4..270c7d8821 100644 --- a/files/fr/web/api/document/selectedstylesheetset/index.html +++ b/files/fr/web/api/document/selectedstylesheetset/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Document/selectedStyleSheetSetIndique le nom du jeu de feuilles de styles actuellement utilisé.
-Syntaxe
+Syntaxe
currentStyleSheetSet = document.selectedStyleSheetSet @@ -22,20 +22,24 @@ document.selectedStyleSheet = newStyleSheetSetEn retour,
-currentStyleSheetSet
indique le nom du jeu de feuilles de styles en cours d'utilisation. Vous pouvez aussi définir celui-ci en utilisant cette propriété.La définition de la valeur de cette propriété équivaut à appeler {{ domxref("document.enableStyleSheetsForSet()") }} avec la valeur de
+currentStyleSheetSet
, puis de définir la valeur delastStyleSheetSet
sur cette valeur.La définition de la valeur de cette propriété équivaut à appeler {{ domxref("document.enableStyleSheetsForSet()") }} avec la valeur de
-currentStyleSheetSet
, puis de définir la valeur delastStyleSheetSet
sur cette valeur.Note : Cette valeur d'attribut est directe : sa modification affectera la valeur de l'attribut.++-Note : Cette valeur d'attribut est directe : sa modification affectera la valeur de l'attribut.
+Exemple
+Exemple
console.log("Current style sheet set: " + document.selectedStyleSheetSet); document.selectedStyleSheetSet = "Some other style sheet";-Note : Cet exemple vous aidera à comprendre la différence de comportement entre la définition de la valeur de+selectedStyleSheetSet
et l'appel de {{ domxref("document.enableStyleSheetsForSet()") }}.+-Note : Cet exemple vous aidera à comprendre la différence de comportement entre la définition de la valeur de
+selectedStyleSheetSet
et l'appel de {{ domxref("document.enableStyleSheetsForSet()") }}.Voir aussi
+Voir aussi
var styleSheetList = document.styleSheets;@@ -20,7 +20,7 @@ original_slug: Web/API/DocumentOrShadowRoot/styleSheets
Il s'agit d'une collection ordonnée d'objets {{domxref("StyleSheet")}}. styleSheetList.item(index)
ou styleSheetList{{ mediawiki.External('index') }}
retourne un seul objet stylesheet par son index
(index
débute par 0).
Renvoie une liste active de tous les jeux de feuilles de styles actuellement disponibles.
-sets = document.styleSheetSets
En retour, sets
est une liste de jeux de feuilles de styles disponibles.
Étant donné un élément {{HTMLElement("ul")}} (liste) avec l'ID "sheetList", vous pouvez le remplir avec tous les noms de tous les jeux de feuilles de styles disponibles avec un code comme celui-ci :
@@ -40,13 +40,13 @@ for (var i = 0; i < sheets.length; i++) {La liste des jeux de feuilles de styles disponibles est construite par énumération de toutes les feuilles de styles disponibles pour le document, dans l'ordre dans lequel elles sont répertoriées dans l'attribut {{domxref("document.styleSheets")}}, en ajoutant le title
(titre) de chacune de celles en ayant un. Les doublons sont supprimés de la liste (en utilisant une comparaison sensible à la casse).
Obtient ou défini le titre de la page.
-var docTitle = document.title;@@ -19,7 +19,7 @@ translation_of: Web/API/Document/title
newTitle
sera le nouveau titre de la page. Le changement de titre affectera également la valeur de retour de document.title
, le titre de la page dans le navigateur (généralement le nom de l'onglet dans votre navigateur), et affectera également le DOM de la page (le contenu de la balise HTML <title>
).
<!DOCTYPE html> <html> @@ -38,7 +38,7 @@ alert(document.title); // Affiche "Goodbye World!" </html>-
Cette propriété s'applique à HTML, SVG, XUL, et aux autres documents Gecko.
@@ -46,9 +46,9 @@ alert(document.title); // Affiche "Goodbye World!"En XUL, accéder à document.title
avant que le document soit complètement chargé a des conséquences variables (document.title
peut retourner une chaîne vide et définir document.title
peut n'avoir aucun effet).
Renvoie le noeud qui est la cible de l'actuel {{ XULElem("tooltip") }}.
-document.tooltipNode;-
XUL-specific method. Not part of any specification. Defined in {{ Source("dom/public/idl/xul/nsIDOMXULDocument.idl#59", "nsIDOMXULDocument.idl") }}.
diff --git a/files/fr/web/api/document/touchend_event/index.html b/files/fr/web/api/document/touchend_event/index.html index f31ff40c44..a12b93005e 100644 --- a/files/fr/web/api/document/touchend_event/index.html +++ b/files/fr/web/api/document/touchend_event/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Document/touchend_eventview
{{readonlyInline}}document.defaultView
(window
of the document)document.defaultView
(window
of the document)detail
{{readonlyInline}}Des exemples d'implémentation de cet événement sont disponibles : Touch events.
+Des exemples d'implémentation de cet événement sont disponibles : Touch events.
L’évènement transitionend
est émis dans les deux directions : quand la transition se termine vers l’état modifié, et quand elle est complètement retournée à l’état par défaut ou non modifié. S’il n’y a pas de délai ou de durée de transition, si les deux sont 0 s ou ne sont pas déclarés, il n’y a pas de transition, et aucun évènement de transition n’est émis. Si l’évènement transitioncancel
est émis, l’évènement transitionend
ne se produira pas.
La cible originale pour cet évènement est l’Element
sur lequel la transition est appliquée. Vous pouvez écouter cet évènement sur l’interface Window
pour le gérer durant les phases de capture ou de bouillonnement. Pour plus de détails sur cet évènement, veuillez consulter la page HTMLElement: transitionend.
La cible originale pour cet évènement est l’Element
sur lequel la transition est appliquée. Vous pouvez écouter cet évènement sur l’interface Window
pour le gérer durant les phases de capture ou de bouillonnement. Pour plus de détails sur cet évènement, veuillez consulter la page HTMLElement: transitionend.
La même chose, mais en utilisant la propriété ontransitionend
au lieu de addEventListener()
:
La même chose, mais en utilisant la propriété ontransitionend
au lieu de addEventListener()
:
document.ontransitionend = () => { console.log('Transition terminée'); };-
Voir un exemple en direct sur cet évènement.
+Voir un exemple en direct sur cet évènement.
transitionrun
, transitionstart
, transitioncancel
HTMLElement
: transitionend
Window
: transitionend
transitionrun
, transitionstart
, transitioncancel
HTMLElement
: transitionend
Window
: transitionend
Retourne l'URL
du {{domxref("Document")}} sous forme de string (lecture seule).
var string = document.URL-
var currentURL = document.URL;
alert(currentURL);
-document.addEventListener("visibilitychange", function() {
- console.log( document.visibilityState );
- // Modifier le comportement...
-});
+document.addEventListener("visibilitychange", function() { + console.log( document.visibilityState ); + // Modifier le comportement... +});
Remarque: À partir de {{Gecko("6.0")}}, document.width
n'est plus pris en charge. Au lieu de cela, utilisez document.body.clientWidth. Voir {{domxref("element.clientWidth")}}.
Note : À partir de {{Gecko("6.0")}}, document.width
n'est plus pris en charge. Au lieu de cela, utilisez document.body.clientWidth. Voir {{domxref("element.clientWidth")}}.
Renvoie la largeur de l'élément {{HTMLElement("body")}} du document courrent en pixels.
Non pris en charge par Internet Explorer.
-pixels = document.width;-
function init() { alert("La largeur du document est " + document.width + " pixels."); }-
document.body.clientWidth /* largeur de <body> */ document.documentElement.clientWidth /* largeur de <html> */ window.innerWidth /* largeur de la fenêtre */-
HTML5
-{{ ApiRef("DOM") }}
-Écrit une chaîne de texte dans un document ouvert par document.open().
+Écrit une chaîne de texte dans un document ouvert par document.open().
Note : comme document.write
écrit dans le flux de documents, appeler document.write
sur un document fermé (chargé) appelle automatiquement document.open
, ce qui efface le document.
Note : comme document.write
écrit dans le flux de documents, appeler document.write
sur un document fermé (chargé) appelle automatiquement document.open
, ce qui efface le document.
document.write(balisage);@@ -29,7 +29,7 @@ translation_of: Web/API/Document/write
<html> @@ -55,22 +55,22 @@ document.close(); </html>-
Écrire dans un document qui a déjà été chargé sans appeler document.open() provoquera un appel automatique à document.open
. Une fois l'écriture terminée, il est recommandé d'appeler document.close() pour indiquer au navigateur qu'il peut terminer de charger la page. Le texte fourni est analysé et intégré à la structure du modèle de document. Dans l'exemple ci-dessus, l'élément h1
devient un nœud dans le document.
Écrire dans un document qui a déjà été chargé sans appeler document.open() provoquera un appel automatique à document.open
. Une fois l'écriture terminée, il est recommandé d'appeler document.close() pour indiquer au navigateur qu'il peut terminer de charger la page. Le texte fourni est analysé et intégré à la structure du modèle de document. Dans l'exemple ci-dessus, l'élément h1
devient un nœud dans le document.
Si l'appel à document.write()
est intégré directement dans le code HTML, il n'appellera pas document.open()
. Par exemple :
<script>
- document.write("<h1>Main title</h1>")
-</script>
+<script> + document.write("<h1>Main title</h1>") +</script>
Note : document.write
et document.writeln ne fonctionnent pas dans les documents XHTML (vous obtiendrez une erreur
"Operation is not supported" [NS_ERROR_DOM_NOT_SUPPORTED_ERR
] dans la console d'erreurs). Cela arrive lors de l'ouverture d'un fichier local avec l'extension de fichier .xhtm ou pour tout document servi avec une application/xhtml+xml
de type MIME. Plus d'informations disponibles dans la foire aux questions W3C XHTML (en).
Note : document.write
et document.writeln ne fonctionnent pas dans les documents XHTML (vous obtiendrez une erreur
"Operation is not supported" [NS_ERROR_DOM_NOT_SUPPORTED_ERR
] dans la console d'erreurs). Cela arrive lors de l'ouverture d'un fichier local avec l'extension de fichier .xhtm ou pour tout document servi avec une application/xhtml+xml
de type MIME. Plus d'informations disponibles dans la foire aux questions W3C XHTML (en).
Note : document.write
dans les scripts deferred (différé) ou asynchronous (asynchrone) sera ignoré et vous recevrez un message comme "A call to document.write()
from an asynchronously-loaded external script was ignored" dans la console d'erreurs.
Note : document.write
dans les scripts deferred (différé) ou asynchronous (asynchrone) sera ignoré et vous recevrez un message comme "A call to document.write()
from an asynchronously-loaded external script was ignored" dans la console d'erreurs.
Note : À partir de la version 55, Chrome n'exécute pas les éléments <script>
injectés via document.write()
en cas d'échec de cache HTTP pour les utilisateurs sur une connexion 2G.
Note : À partir de la version 55, Chrome n'exécute pas les éléments <script>
injectés via document.write()
en cas d'échec de cache HTTP pour les utilisateurs sur une connexion 2G.
write()
Methodwrite()
MethodÉcrit une chaine de caractères suivie d'un retour de ligne.
-document.writeln(ligne); +document.writeln(ligne);-Paramètres
+Paramètres
ligne
est la chaine de caractère contenant le texte.document.writeln("<p>Entrez votre mot de passe :</p>");-
document.writeln est identique à {{domxref("document.write")}}, mais ajoute une nouvelle ligne.
-NS_ERROR_DOM_NOT_SUPPORTED_ERR
) dans la console). Ceci est le cas si un fichier est ouvert en local avec l'extension .xhtml ou pour tous documents utilisant le type MIME application/xhtml+xml. Pour plus d'informations, visitez W3C XHTML FAQ.