在页面的任意位置,在javascript中的鼠标指针下找到一个单词

在页面的任意位置,在javascript中的鼠标指针下找到一个单词,javascript,jquery,Javascript,Jquery,我可以使用此代码查找元素的文本。但如果鼠标在某个单词上停留一段时间,我想在页面的任何位置查找该单词 $(document).bind("mouseover", function (e) { var event = e; setTimeout(function () { $(event.target).contents().each(function(index, elem) { if( elem.nodeType === 3 && $.trim(e

我可以使用此代码查找元素的文本。但如果鼠标在某个单词上停留一段时间,我想在页面的任何位置查找该单词

$(document).bind("mouseover", function (e) {
    var event = e;
    setTimeout(function () { $(event.target).contents().each(function(index, elem) {
        if( elem.nodeType === 3 && $.trim(elem.nodeValue).length ) {
            var text = $.trim(elem.nodeValue);
            text = text.split(" ");
            console.log($.trim(elem.nodeValue));
            //alert($.trim(elem.nodeValue));
            return false;
         }
      });
   }, 5000);

}))

这可能不是有史以来最好的代码,但它可能会让您走上正确的轨道,脱离andyb的评论

差不多

$(".first").on("hover",function(){

  var words = $(this).text().split(" ");

  var fullText = "";

  for(i=0;i<words.length;i++){
    words[i] = "<span>"+words[i]+"</span> "; 
    fullText += words[i];
  }  

  $(this).text("").append(fullText);

  $(this).children("span").on("hover", function(){
    $(".second").text($(this).text());
  });

});
$(.first”).on(“悬停”,函数(){
var words=$(this.text().split(“”);
var全文=”;
对于(i=0;i
$(document).bind(“mouseover”,函数(e){
var事件=e;
setTimeout(函数(){$(event.target).contents()。每个(函数(索引,元素){
if(elem.nodeType===3&$.trim(elem.nodeValue).length){
var text=$.trim(elem.nodeValue);
text=text.split(“”);
var words=(elem.nodeValue).split(“”);
var全文=”;

for(i=0;iA word与它的包含元素不同,它不是DOM节点,这意味着它无法通过DOM访问。java脚本或jquery中是否有其他方法可以做到这一点?我环顾了四周,但它看起来不像。您需要做的是将单词包装在内联元素(例如,跨距)中。我也有这个想法。但是为每个单词放置span或html标记是一项相当长的任务。所有来自db或动态生成的文本,我必须首先拆分它并放置span标记……:(拆分并将单词包装到目标元素中怎么样?您不必(也不应该!)更改整个页面。然后,您可以用
d元素替换DOM中的元素,这应该只允许对一个单词进行更精细的选择。+1回答很好。我可能会做的唯一不同的部分是将字符串串联替换为数组
.push()
,然后
.join(“”)
之后。实际上这可能是过早的优化:-)@andyb啊,是的,很好的决定。我的内心是一个设计师,所以我的代码总是不够完美:)谢谢你的更正!对不起,我希望你没有误会;这根本不是批评。我不是想从这个完美工作的解决方案中拿走任何东西!@andyb别担心,我真的很感激代码审查,并看到我可以改进的地方。每一点都有帮助!
   $(document).bind("mouseover", function (e) {
      var event = e;
      setTimeout(function () { $(event.target).contents().each(function(index, elem) {
      if( elem.nodeType === 3 && $.trim(elem.nodeValue).length ) {
      var text = $.trim(elem.nodeValue);
      text = text.split(" ");
      var words = (elem.nodeValue).split(" ");

      var fullText = "";

      for(i=0;i<words.length;i++){
          words[i] = "<span>"+words[i]+"</span> ";
          fullText += words[i];
      }

      $(event.target).html("").append(fullText);

      $(event.target).children("span").on("hover", function(){
          //$(".second").text($(this).text());
          console.log($(this).text());
       });
          console.log($(event.target).html());

          return false;
       } //alert($(event.target).text()+$(event.target).html());
   });},