Comment changer la couleur d'arrière-plan du texte sélectionné avec JavaScript ?

Comment modifier le CSS du texte sélectionné avec JavaScript

Afin d'améliorer la fonctionnalité d'une page Web, vous souhaiterez peut-être créer un bookmarklet JavaScript qui met en surbrillance le texte sélectionné, en changeant son arrière-plan en jaune. Bien que vous puissiez facilement récupérer le texte à l'aide de getSelText(), vous pouvez rencontrer des difficultés lorsque vous tentez de modifier son CSS avec la fonction highlightSelText() de jQuery.

Ce problème survient car highlightSelText() n'est pas en mesure de modifier le CSS. du texte sélectionné. Une solution plus efficace consiste à utiliser la méthode execCommand(), qui fournit une commande pour modifier la couleur d'arrière-plan dans les navigateurs contemporains. Voici un extrait de code mis à jour qui exploite cette fonctionnalité :

function highlight(colour) {
    var range, sel;
    if (window.getSelection) {
        // IE9 and non-IE
        try {
            if (!document.execCommand("BackColor", false, colour)) {
                makeEditableAndHighlight(colour);
            }
        } catch (ex) {
            makeEditableAndHighlight(colour)
        }
    } else if (document.selection && document.selection.createRange) {
        // IE <= 8 case
        range = document.selection.createRange();
        range.execCommand("BackColor", false, colour);
    }
}

Cette fonction tire parti de execCommand() pour appliquer la couleur d'arrière-plan souhaitée au texte sélectionné, garantissant ainsi la compatibilité avec tous les principaux navigateurs, y compris Internet Explorer.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!