jQuery是一個非常流行的JavaScript庫,用于簡化HTML文檔的遍歷和操作、事件處理、動畫效果以及AJAX操作。其中,通過jQuery選中頁面中的文本內(nèi)容,并為其更改背景色是一種常見的需求。下面將演示如何使用jQuery來完成這個操作。
// 選中文本 var selectedText = window.getSelection().toString(); // 更改背景色 $(document).ready(function() { $('p').mouseup(function() { // 選中文本 var selectedText = window.getSelection().toString(); // 更改背景色 if (selectedText) { $(this).css('background-color', 'yellow'); } }); });
首先,我們通過window.getSelection().toString()方法來獲取選中的文本內(nèi)容,并將其賦值給變量selectedText。接下來,在頁面加載完成后(即$(document).ready(function() {...})),我們監(jiān)聽到了
標(biāo)簽的mouseup事件,即當(dāng)鼠標(biāo)松開時,執(zhí)行回調(diào)函數(shù)。在回調(diào)函數(shù)內(nèi)部,我們首先再獲取一遍選中文本內(nèi)容,然后判斷其是否為空。如果不為空,即表示有文本被選中了,就通過$(this).css('background-color', 'yellow')來將選中的文本背景色更改為黃色。
以上就是通過jQuery選中文本并更改背景色的操作代碼,通過這個例子也能看出jQuery的語法相對來說是比較簡潔易懂的,而且支持大部分瀏覽器,可以讓我們節(jié)省不少時間和精力。
上一篇css底邊邊界模糊