相关疑难解决方法(0)

我基本上需要突出显示一个文本块中的特定单词.例如,假装我想在本文中突出显示"dolor"这个词:

<p>
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
</p>
<p>
    Quisque bibendum sem ut lacus. Integer dolor ullamcorper libero.
    Aliquam rhoncus eros at augue. Suspendisse vitae mauris.
</p>

如何将上述内容转换为以下内容:

<p>
    Lorem ipsum <span class="myClass">dolor</span> sit amet, consectetuer adipiscing elit.
</p>
<p>
    Quisque bibendum sem ut lacus. Integer <span class="myClass">dolor</span> ullamcorper
    libero. Aliquam rhoncus eros at augue. Suspendisse vitae mauris.
</p>

这有可能与jQuery？

编辑:正如Sebastian 指出的那样,没有jQuery这很有可能 - 但是我希望有一个特殊的jQuery方法可以让你在文本本身上做选择器.我已经在这个网站上大量使用jQuery了,所以把所有内容都包含在jQuery中会让事情变得更加整洁.

可能重复:
getElementsByTagName()等效于textNodes

对于这个问题,我需要找到特定节点下的所有文本节点.我可以这样做:

function textNodesUnder(root){
  var textNodes = [];
  addTextNodes(root);
  [].forEach.call(root.querySelectorAll('*'),addTextNodes);
  return textNodes;

  function addTextNodes(el){
    textNodes = textNodes.concat(
      [].filter.call(el.childNodes,function(k){
        return k.nodeType==Node.TEXT_NODE;
      })
    );
  }
}

然而,鉴于XPath可以简单地查询.//text()并完成它,这似乎是不优雅的.

将所有文本节点放在HTML文档中的特定元素下的最简单方法是什么,适用于IE9 +,Safari5 +,Chrome19 +,Firefox12 +,Opera11 +？

"最简单"被宽松地定义为"有效且短暂,没有打高尔夫球".

我有以下内容div:

<div id="query" style="width:500px; height:200px;border:1px solid black"
 spellcheck="false" contenteditable="true"></div>?

客户端可以编写SQL查询的位置.我试图做的是在点击Spacea 后用客户端输入的单词,span并class根据键入的单词给出这个跨度:

例

如果客户端类型select我需要在div中包装这样的选择单词:

<span class='select'> SELECT </span> <span> emp_name </span>

CSS

.select{color:blue ;text-transform:uppercase;}

这与什么非常相似jsFiddle.我怎样才能实现这一目标？

这是我到目前为止所尝试的:jsFiddle

$(function(){
    $('div').focus() ;
    $('div').keyup(function(e){
        //console.log(e.keyCode) ;
        if(e.keyCode == 32){
            var txt = $('div').text() ;
            var x = 'SELECT' ;
            $('div:contains("'+x+'")').wrap("<span style='color:blue ;
      text-transform:uppercase;'>") ;
            if(txt == 'SELECT'){
                console.log('found') ; // why This Doesn't do any thing  ?
            }

        }
    }); …