diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:40:17 -0500 |
commit | 33058f2b292b3a581333bdfb21b8f671898c5060 (patch) | |
tree | 51c3e392513ec574331b2d3f85c394445ea803c6 /files/fr/web/api/documentorshadowroot | |
parent | 8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff) | |
download | translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2 translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip |
initial commit
Diffstat (limited to 'files/fr/web/api/documentorshadowroot')
-rw-r--r-- | files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html | 104 | ||||
-rw-r--r-- | files/fr/web/api/documentorshadowroot/index.html | 78 |
2 files changed, 182 insertions, 0 deletions
diff --git a/files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html b/files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html new file mode 100644 index 0000000000..c3f8c30d22 --- /dev/null +++ b/files/fr/web/api/documentorshadowroot/elementsfrompoint/index.html @@ -0,0 +1,104 @@ +--- +title: DocumentOrShadowRoot.elementsFromPoint() +slug: Web/API/DocumentOrShadowRoot/elementsFromPoint +tags: + - API + - Document + - DocumentOrShadowRoot + - Méthode + - Reference + - ShadowRoot + - elementsFromPoint + - elementsFromPoint() + - shadow dom +translation_of: Web/API/DocumentOrShadowRoot/elementsFromPoint +--- +<div>{{APIRef("DOM")}}{{SeeCompatTable}}</div> + +<p><span class="seoSummary">La propriété <strong><code>elementsFromPoint()</code></strong> de l'interface {{domxref("DocumentOrShadowRoot")}} renvoie un tableau (<em>array</em>) de tous les éléments présents sous le point fourni en paramètre (relatif au <em>viewport</em>).</span></p> + +<h2 id="Syntaxe">Syntaxe</h2> + +<pre class="syntaxbox">var elements = document.elementsFromPoint(x, y);</pre> + +<h3 id="Paramètres">Paramètres</h3> + +<dl> + <dt>x</dt> + <dd>L'abscisse du point (coordonnée horizontale).</dd> + <dt>y</dt> + <dd>L'ordonnée du point (coordonnée verticale).</dd> +</dl> + +<h3 id="Valeur_de_retour">Valeur de retour</h3> + +<p>Un tableau (<em>array</em>) d'objets {{domxref('element')}} représentants les éléments du DOM concernés.</p> + +<h2 id="Example" name="Example">Exemples</h2> + +<h3 id="HTML">HTML</h3> + +<pre class="brush: html"><div> + <p>Du texte</p> +</div> +<p>Éléments au point 30, 20:</p> +<div id="output"></div> +</pre> + +<h3 id="JavaScript">JavaScript</h3> + +<pre class="brush: js;highlight[1]">var output = document.getElementById("output"); +if (document.elementsFromPoint) { + var elements = document.elementsFromPoint(30, 20); + for(var i = 0; i < elements.length; i++) { + output.textContent += elements[i].localName; + if (i < elements.length - 1) { + output.textContent += " < "; + } + } +} else { + output.innerHTML = "<span style=\"color: red;\">" + + "Votre navigateur ne prend pas en charge <code>document.elementsFromPoint()</code>" + + "</span>"; +}</pre> + +<h3 id="Résultat">Résultat</h3> + +<p>{{EmbedLiveSample('Example', '420', '120')}}</p> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">État</th> + <th scope="col">Commentaires</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Shadow DOM','#extensions-to-the-documentorshadowroot-mixin','DocumentOrShadowRoot')}}</td> + <td>{{Spec2('Shadow DOM')}}</td> + <td>Définition initiale</td> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#dom-document-elementsfrompoint', 'Document')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Précise l'ordre selon lequel les éléments sont peints.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une <em>pull request</em>.</div> + +<p>{{Compat("api.DocumentOrShadowRoot.elementsFromPoint")}}</p> + +<h2 id="Voir_aussi">Voir aussi</h2> + +<ul> + <li>{{DOMxRef("DocumentOrShadowRoot.elementFromPoint()")}}</li> + <li>{{DOMxRef("DocumentOrShadowRoot.msElementsFromRect()")}} {{Non-standard_Inline}}</li> +</ul> diff --git a/files/fr/web/api/documentorshadowroot/index.html b/files/fr/web/api/documentorshadowroot/index.html new file mode 100644 index 0000000000..d8dd814377 --- /dev/null +++ b/files/fr/web/api/documentorshadowroot/index.html @@ -0,0 +1,78 @@ +--- +title: DocumentOrShadowRoot +slug: Web/API/DocumentOrShadowRoot +tags: + - API + - Document + - DocumentOrShadowRoot + - Interface + - Reference + - ShadowRoot + - shadow dom +translation_of: Web/API/DocumentOrShadowRoot +--- +<div>{{APIRef("Web Components")}}</div> + +<p><span class="seoSummary">Le <strong><code>DocumentOrShadowRoot</code></strong> mélange de l'<a href="/fr/docs/Web/Web_Components/Using_shadow_DOM">API Shadow DOM</a> qui fournit des API qui sont partagées entre les documents et les racines fantômes. Les fonctionnalités suivantes sont incluses dans {{DOMxRef("Document")}} et {{DOMxRef("ShadowRoot")}}.</span></p> + +<h2 id="Propriétés">Propriétés</h2> + +<dl> + <dt>{{DOMxRef("DocumentOrShadowRoot.activeElement")}}{{ReadOnlyInline}}</dt> + <dd>Renvoie l'{{DOMxRef('Element')}} dans l'arbre <code>shadow</code> qui a le focus.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.fullscreenElement")}}{{ReadOnlyInline}}</dt> + <dd>Renvoie l'{{DOMxRef('Element')}} qui est actuellement en mode plein écran pour ce document.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.pointerLockElement")}} {{Experimental_Inline}}{{ReadOnlyInline}}</dt> + <dd>Renvoie l'élément défini comme cible pour les événements de la souris lorsque le pointeur est verrouillé. Il renvoie <code>null</code> si le verrouillage est en cours, si le pointeur est déverrouillé ou si la cible se trouve dans un autre document.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.styleSheets")}}{{ReadOnlyInline}}</dt> + <dd>Renvoie une {{DOMxRef('StyleSheetList')}} d'objets {{DOMxRef('CSSStyleSheet')}} pour les feuilles de style explicitement liées ou intégrées dans un document.</dd> +</dl> + +<h2 id="Méthodes">Méthodes</h2> + +<dl> + <dt>{{DOMxRef("DocumentOrShadowRoot.caretPositionFromPoint()")}}</dt> + <dd>Renvoie un objet {{DOMxRef('CaretPosition')}} contenant le noeud DOM contenant le signe d'insertion, et le décalage du caractère d'insertion dans ce noeud.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.elementFromPoint()")}}</dt> + <dd>Renvoie l'élément le plus élevé aux coordonnées spécifiées.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.elementsFromPoint()")}}</dt> + <dd>Renvoie un tableau de tous les éléments aux coordonnées spécifiées.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.getSelection()")}}</dt> + <dd>Renvoie un objet {{DOMxRef('Selection')}} représentant la plage de texte sélectionnée par l'utilisateur, ou la position actuelle du curseur.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.nodeFromPoint()")}} {{non-standard_inline}}</dt> + <dd>Renvoie le nœud supérieur aux coordonnées spécifiées.</dd> + <dt>{{DOMxRef("DocumentOrShadowRoot.nodesFromPoint()")}} {{non-standard_inline}}</dt> + <dd>Renvoie un tableau de tous les nœuds aux coordonnées spécifiées.</dd> +</dl> + +<h2 id="Spécifications">Spécifications</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spécification</th> + <th scope="col">Statut</th> + <th scope="col">Commentaire</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Shadow DOM','#extensions-to-the-documentorshadowroot-mixin','DocumentOrShadowRoot')}}</td> + <td>{{Spec2('Shadow DOM')}}</td> + <td>Implémentation de Shadow DOM.</td> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG','#mixin-documentorshadowroot','DocumentOrShadowRoot')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Définition initiale.</td> + </tr> + </tbody> +</table> + +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> + +<div class="hidden">Le tableau de compatibilité de cette page est généré à partir de données structurées. Si vous souhaitez contribuer aux données, veuillez consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et envoyez-nous une <em>pull request</em>.</div> + +<p>{{Compat("api.DocumentOrShadowRoot")}}</p> + +<p>[1] Les fonctionnalités de cette interface sont toujours implémentées sur l'objet {{DOMxRef("Document")}}.</p> |