Question

我是javascript的新手，请原谅我的天真。我发现了一种似乎不一致的行为，至少对我而言。在做一些测试时，我输入了以下两行代码：

console.log(document.getElementById("errorMessage"));
window.alert(document.getElementById("errorMessage"));

我完全希望两者能给我相同的结果，但不，我没有。

console.log(document.getElementById("errorMessage"));

给了我：

    <span id="errorMessage">

，而

window.alert(document.getElementById("errorMessage"));

给了我警告窗口：

    [Object HTMLSpanElement]

任何人都可以帮助我理解为什么我得到不同的结果，即使我传递了完全相同的论点？

补充说明：这不是一个重复的问题，因为上面引用的问题哪个更好，而不是两者之间有什么区别。

Answer 1

console.log被允许执行“浏览器开发人员工具无论做什么”。因此，console.log 仅适用于实时调试，并且在Firefox，Chrome和IE中的行为有所不同（在IE中，它将显示与警报相同的文本）。

现在，alert始终有效，因为将输入视为字符串，并根据需要应用[[ToString]]转换。在DOM元素上 - 使用toString()进行转换 - 这不是很令人兴奋，最终会被注意到字符串“[Object blahblah]”。（我相信确切的文字可能因浏览器而异。）

通过强制将元素手动
，可以轻松获得与console.log 相同的行为：

console.log("" + document.getElementById("errorMessage"))

然而，反之亦然，虽然可以通过在警报中显示"outer HTML"来进行模拟，但console.log行为结果在某些开发人员工具中只是（精彩）魔术。< / p>
这种魔力允许Chrome提供对console.log提供的对象（包括DOM元素）的“实时检查”。但是，如上所述，IE的console.log（至少高达IE10）也强制将值赋予字符串..这不是那么神奇，而且非常像警报。

虽然警报可以用于“快速调试”，但我建议您使用debugger，console.log以及相应提供的断点/异常支持开发人员工具，因为它们更适合手头的任务。

Answer 2

实际上，tow方法会给你相同的结果，只是你的控制台执行对SpanElement的解析，并显示更多细节。

Answer 3

console.log将读取并转储它作为参数（对象，数组或字符串）接收的内容，而window.alert将只获取参数的字符串值。

Answer 4

alert（）使用对象的toString（）方法将传递给它的对象转换为字符串。与alert（）不同，console.log（）不仅限于显示简单的字符串，还允许您与传递给它的对象进行交互。例如，让您检查其属性。

http://blogs.msdn.com/b/cdndevs/archive/2011/05/26/console-log-say-goodbye-to-javascript-alerts-for-debugging.aspx

Javascript命令：window.alert vs console.log

4 个答案: