Est-il possible de surligner du texte dans un document HTML en utilisant sans l'empaqueter avec <span> ou n'importe quel autre tag d'ailleurs?Comment surligner le texte HTML sans l'entourer de tags?
Par exemple, dans le code HTML <p>The quick fox</p> je voudrais mettre en évidence quick mais sans ajouter un élément DOM autour. Ajouter un élément DOM à un élément parent est correct.
Merci!
Non, ce n'est pas possible.
Vous ne pouvez pas demander au navigateur de restituer un texte différemment sans modifier le DOM de manière inhérente, que vous le fassiez de manière statique ou dynamique (avec Javascript, par exemple, en tant qu'étape de post-traitement).
Vous n'avez pas besoin de changer le DOM si vous changez les pixels dans une superposition de canevas transparente. –
Comment obtiendriez-vous la position absolue d'un morceau de texte sans changer le DOM? –
Ajoutez l'élément au DOM, trouvez sa position, puis supprimez-le et normalisez(). – Sleepster
Ce n'est pas possible.
Si vous ne voulez simplement pas de balises dans le code source d'origine, cela pourrait être possible en ajoutant des balises plus tard en utilisant Javascript magic. Vous pouvez faire quelque chose comme
<p highlight="quick">The quick fox</p>
et écrire une fonction JQuery/Prototype/JS plaine pour le sélectionner à la volée, mais pour quoi et pourquoi? Si vous élaborez un peu, quelqu'un peut venir avec une idée.
La seule façon de faire cela que je peux imaginer serait d'utiliser l'élément <canvas>, et rendre absolument tout à la main.
Il est possible d'utiliser un élément positionné de façon absolue avec une image de fond répétitive transparente ou une couleur d'arrière-plan transparente (en utilisant rgba ou hsla) et de le positionner sur la zone sélectionnée. Une autre façon de le faire serait d'avoir un élément de canevas positionné en absolu sans arrière-plan qui occupe toute la fenêtre du navigateur et dessine un rectangle transparent sur la sélection.
Comment obtiendriez-vous la position absolue d'un morceau de texte sans changer le DOM? –
Ajoutez l'élément au DOM, trouvez sa position, puis supprimez-le et normalisez(). – Sleepster
Pourquoi voulez-vous faire cela? – DOK
Je voudrais mettre en évidence (en utilisant des cadres de délimitation) plusieurs éléments de recherche. Cependant, imaginez les 2 éléments de recherche suivants: "Le rapide" et "Renard rapide". Si je souligne "le rapide" en l'enveloppant, il deviendra un nœud TEXT séparé et il serait difficile de trouver "quick fox". Une technique à laquelle je pense est: 1. Ajout temporaire d'un élément . 2. Trouver le cadre de délimitation de l'élément (en utilisant offset(), width, height). 3. Supprimer l'élément ci-dessus. 4. Ajout d'une boîte aux dimensions ci-dessus au contenant. Peut fonctionner si le texte n'est pas enroulé ... – Sleepster