javascript - jQuery console.log() 与 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]

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

Answer 1

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

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

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

alert(e.target.outerHTML);

Answer 2

console.log当您想查看对象的属性时很有用，但alert()只显示对象的类型，如果您想查看元素的真实 html，可以使用outerHTMLDOM Element 对象的属性：

alert(e.target.outerHTML);

http://jsfiddle.net/phLVu/

Answer 3

请参阅另一个 SO 问题：

您必须使用该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;