如何使用 jQuery 突出顯示文字？

使用 jQuery反白文字

問題描述：

您想要突出顯示特定單字在給定的文字區塊內使用jQuery.

解：

要使用jQuery突出顯示單字，您可以使用插件，例如突出顯示或下面提供的原始腳本的更新版本：

jQuery.fn.highlight = function (pat) {
  function innerHighlight(node, pat) {
    var skip = 0;
    if (node.nodeType == 3) {
      var pos = node.data.toUpperCase().indexOf(pat);
      if (pos >= 0) {
        var spannode = document.createElement('span');
        spannode.className = 'highlight';
        var middlebit = node.splitText(pos);
        var endbit = middlebit.splitText(pat.length);
        var middleclone = middlebit.cloneNode(true);
        spannode.appendChild(middleclone);
        middlebit.parentNode.replaceChild(spannode, middlebit);
        skip = 1;
      }
    } else if (node.nodeType == 1 && node.childNodes && !/(script|style)/i.test(node.tagName)) {
      for (var i = 0; i <p><strong>替代方法：</strong></p><p>如果您喜歡更新且功能豐富的解決方案，請考慮以下插件：</p><pre class="brush:php;toolbar:false">jQuery.extend({
  highlight: function (node, re, nodeName, className) {
    if (node.nodeType === 3) {
      var match = node.data.match(re);
      if (match) {
        var highlight = document.createElement(nodeName || 'span');
        highlight.className = className || 'highlight';
        var wordNode = node.splitText(match.index);
        wordNode.splitText(match[0].length);
        var wordClone = wordNode.cloneNode(true);
        highlight.appendChild(wordClone);
        wordNode.parentNode.replaceChild(highlight, wordNode);
        return 1; //skip added node in parent
      }
    } else if ((node.nodeType === 1 && node.childNodes) && // only element nodes that have children
      !/(script|style)/i.test(node.tagName) && // ignore script and style nodes
      !(node.tagName === nodeName.toUpperCase() && node.className === className)) { // skip if already highlighted
      for (var i = 0; i <p>此外掛提供了附加功能，例如為突出顯示的元素指定自訂標籤名稱和類別名稱、搜尋多個同時搜尋術語，並執行區分大小寫的搜尋。它還包括一種刪除現有突出顯示的方法。 </p>

以上是如何使用 jQuery 突出顯示文字？的詳細內容。更多資訊請關注PHP中文網其他相關文章！