Question

我想输出我悬停的元素。我不想在里面输出html。

EG ..如果我将鼠标悬停在

上

<i class="fa fa-wrench"><span>TEST</span></i>

我可以输出类似

的内容

<i class="fa fa-wrench">

我的尝试

我可以成功地将该元素输出到console.log中，但是当我使用append执行此操作时，我得到[object Object]的输出。

示例代码

FROM：jQuery: how to get the innermost dom element I'm hovering over, globally for the whole document body?

var currentNode = null;
$('body').mousemove(function(event) {
  if ($(event.target) !== currentNode) {
    currentNode = $(event.target);
    console.log(currentNode);
  }
});

输出示例（来自console.log）：

[i.fa.fa-wrench, context: i.fa.fa-wrench, jquery: "1.11.0", constructor: function, selector: "", toArray: function…]

我的附录代码：

$('.specific-div).append('<div>ID:' + currentNode + '</div>');

输出示例（附加到.specific-div）：[object Object]

Answer 1

http://jsfiddle.net/fSb23/

var currentNode = null;
$('body').mousemove(function (event) {
    if ($(event.target) !== currentNode) {
        currentNode = $(event.target).attr("id");
        console.log(currentNode);
        $('.specific-div').append(' < div > ID: ' + currentNode + ' < /div>');
  }
});

如果您想获取HTML而不仅仅是ID，请尝试：

currentNode = $(event.target).html();

Answer 2

尝试

var currentNode = null;
 $('body').mousemove(function(event) {
 if ($(event.target) != currentNode) {
  currentNode = $(event.target);
  htmlText = $('<div>').append($(currentNode).clone().empty()).html();
  console.log(htmlText);
 }
});

JSfiddle

Answer 3

假设所有元素的类都是唯一的，请获取您悬停在其上的元素的类：

    var handle = document.querySelectorAll('.class-of-hovered-element')[0].outerHTML;
    console.log(handle);

如果有帮助，请告诉我。

Answer 4

试试这个：

对于每个元素，将在mousemove

上生成大量输出

var currentNode = null;
$('body >').mousemove(function(event) {
    if ($(event.target) !== currentNode) {
        $('.specific-div').append($('<p>').text($('<p>').append($(this).clone().empty()).html()));
        currentNode = $(event.target);
    }
});

jsFiddle

对于像class

这样的fa-wrench

$('.fa-wrench').mouseenter(function() {
   $('.specific-div').append($('<p>').text($('<p>').append($(this).clone().empty()).html()));
});

Answer 5

var currentNode = null;
 $('body').click(function(event) {

 if ($(event.target) !== currentNode) {

   var tag=$(event.target).prop('tagName');
   tag="<"+tag;
   $.each($(event.target).attributes, function() {
    if(this.specified) {
      tag+=this.name+"='"+this.name+"' ";
     }
 });
 tag+=">";
 console.log(tag);

 }

});

并在jquery

中添加

(function(old) {
$.fn.attr = function() {
if(arguments.length === 0) {
  if(this.length === 0) {
    return null;
  }

  var obj = {};
  $.each(this[0].attributes, function() {
    if(this.specified) {
      obj[this.name] = this.value;
    }
  });
  return obj;
}

 return old.apply(this, arguments);
};
})($.fn.attr);

这可能有助于尝试..

jQuery输出当前元素悬停在append上

我的尝试

示例代码

我的附录代码：

5 个答案: