Document.caretRangeFromPoint()

Non standard: Cette fonctionnalité n'est pas standardisée. Nous déconseillons d'utiliser des fonctionnalités non standard en production, car leur prise en charge par les navigateurs est limitée, et elles peuvent être modifiées ou supprimées. Toutefois, elles peuvent constituer une alternative appropriée dans certains cas où aucune option standard n'existe.

La méthode caretRangeFromPoint(), rattachée à l'interface Document, renvoie un objet Range correspondant au fragment de document situé aux coordonnées indiquées.

Syntaxe

caretRangeFromPoint(x, y);

Paramètres

x: L'abscisse de la position ciblée au sein de la zone d'affichage (viewport) actuelle.
y: L'ordonnée de la position ciblée au sein de la zone d'affichage (viewport) actuelle.

Valeur de retour

La valeur de retour peut être :

Un objet Range
Ou null, si x ou y sont négatifs, situés en dehors de la zone d'affichage ou s'il n'y a pas de nœud texte correspondant.

function insertBreakAtPoint(e) {
 let range;
 let textNode;
 let offset;
 if (document.caretRangeFromPoint) {
 range = document.caretRangeFromPoint(e.clientX, e.clientY);
 textNode = range.startContainer;
 offset = range.startOffset;
 } else if (document.caretPositionFromPoint) {
 range = document.caretPositionFromPoint(e.clientX, e.clientY);
 textNode = range.offsetNode;
 offset = range.offset;
 } else {
 document.body.textContent =
 "[Ce navigateur ne supporte ni" +
 " document.caretRangeFromPoint" +
 " ni document.caretPositionFromPoint.]";
 return;
 }
 // On opère uniquement sur le texte
 if (textNode && textNode.nodeType == 3) {
 let replacement = textNode.splitText(offset);
 let br = document.createElement("br");
 textNode.parentNode.insertBefore(br, replacement);
 }
}
let paragraphs = document.getElementsByTagName("p");
for (let i = 0; i < paragraphs.length; i++) {
 paragraphs[i].addEventListener("click", insertBreakAtPoint, false);
}

HTML

html

<p>
 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy
 eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
 voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita
 kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
</p>