jQuery console.log（）vs alert（）

Question

jQuery代码：

$(document).bind('click', function(e) {
    console.log(e.target);
    alert(e.target);
});

e.target包含被点击的对象的名称。 出于演示目的，如果我单击输入元素，上面的代码将打印以下内容：
对于console.log()：

<input class="buton" type="submit" value="Send" name="Send">

alert()：

[object HTMLInputElement]

但是，如果我将console.log(e.target)替换为console.log(e.target.toString())，则会打印与alert()相同的内容，这意味着：

[object HTMLInputElement]

我的范围是将console.log()返回的HTML代码存储到变量中，但我无法理解该行为。

Answer 1

在事件处理程序中，e.target是点击源自的元素。大多数浏览器控制台将其显示为表示元素的html字符串。

当您使用alert时，提供的参数将转换为字符串，因此您将看到[object HTMLInputElement]。

要获取元素的HTML，请使用：

alert(e.target.outerHTML);

Answer 2

当你想要查看对象的属性时，

console.log很有用，但alert()只显示对象的类型，如果你想看到一个元素的真实html，你可以使用{ DOM Element对象的{1}}属性：

outerHTML

http://jsfiddle.net/phLVu/

Answer 3

请参阅此other SO question：

您必须使用outerHTML属性。

$(document).bind('click', function(e) {
    alert(e.target.outerHTML);
});

在此处查看jsFiddle：http://jsfiddle.net/xhHPb/

Answer 4

控制台工具以设计师认为有用的方式显示对象，与toString()相反，它不仅调用对象的alert方法。

如果您想获取目标的HTML代码，只需执行

即可

var html = e.target.outerHTML;