JavaScript로 선택한 텍스트의 배경색을 변경하는 방법은 무엇입니까?-CSS 튜토리얼-php.cn

JavaScript로 선택한 텍스트의 배경색을 변경하는 방법은 무엇입니까?

Susan Sarandon

풀어 주다： 2024-11-20 01:22:03

원래의

873명이 탐색했습니다.

How to Change the Background Color of Selected Text with JavaScript?

JavaScript를 사용하여 선택한 텍스트의 CSS를 변경하는 방법

웹 페이지 기능을 향상시키기 위해 JavaScript 북마크를 생성할 수 있습니다. 선택한 텍스트를 강조 표시하고 배경을 노란색으로 변경합니다. getSelText()를 사용하여 쉽게 텍스트를 검색할 수 있지만 jQuery의 하이라이트SelText() 함수를 사용하여 CSS를 변경하려고 하면 어려움이 발생할 수 있습니다.

이 문제는 하이라이트SelText()가 CSS를 변경할 수 없기 때문에 발생합니다. 선택한 텍스트의 보다 효과적인 해결책은 최신 브라우저에서 배경색을 수정하는 명령을 제공하는 execCommand() 메서드를 사용하는 것입니다. 다음은 이 기능을 활용하는 업데이트된 코드 조각입니다.

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 &amp;&amp; document.selection.createRange) {
        // IE <= 8 case
        range = document.selection.createRange();
        range.execCommand("BackColor", false, colour);
    }
}

로그인 후 복사

이 함수는 execCommand()를 활용하여 선택한 텍스트에 원하는 배경색을 적용하여 Internet Explorer를 포함한 모든 주요 브라우저와의 호환성을 보장합니다.

위 내용은 JavaScript로 선택한 텍스트의 배경색을 변경하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!