我们如何使用 IE 8 调试 JavaScript?
更新到 IE 8 后,无法使用 Visual Studio 进行 JavaScript 调试。
我们如何使用 IE 8 调试 JavaScript?
更新到 IE 8 后,无法使用 Visual Studio 进行 JavaScript 调试。
我今天发现我们现在可以使用 IE 8 中集成的开发人员工具栏插件调试 Javascript。
您可以使用监视、断点、查看调用堆栈等,类似于专业浏览器中的调试器。
您还可以debugger;
在 JavaScript 代码中使用该语句设置断点。
您可以在Debugging JScript或Debugging Script with the Developer Tools 中获得有关 IE8 开发者工具栏调试的更多信息。
这不会帮助您单步执行代码或中断错误,但它是在所有浏览器上为您的项目获得相同调试控制台的有用方法。
myLog = function() {
if (!myLog._div) { myLog.createDiv(); }
var logEntry = document.createElement('span');
for (var i=0; i < arguments.length; i++) {
logEntry.innerHTML += myLog.toJson(arguments[i]) + '<br />';
}
logEntry.innerHTML += '<br />';
myLog._div.appendChild(logEntry);
}
myLog.createDiv = function() {
myLog._div = document.body.appendChild(document.createElement('div'));
var props = {
position:'absolute', top:'10px', right:'10px', background:'#333', border:'5px solid #333',
color: 'white', width: '400px', height: '300px', overflow: 'auto', fontFamily: 'courier new',
fontSize: '11px', whiteSpace: 'nowrap'
}
for (var key in props) { myLog._div.style[key] = props[key]; }
}
myLog.toJSON = function(obj) {
if (typeof window.uneval == 'function') { return uneval(obj); }
if (typeof obj == 'object') {
if (!obj) { return 'null'; }
var list = [];
if (obj instanceof Array) {
for (var i=0;i < obj.length;i++) { list.push(this.toJson(obj[i])); }
return '[' + list.join(',') + ']';
} else {
for (var prop in obj) { list.push('"' + prop + '":' + this.toJson(obj[prop])); }
return '{' + list.join(',') + '}';
}
} else if (typeof obj == 'string') {
return '"' + obj.replace(/(["'])/g, '\\$1') + '"';
} else {
return new String(obj);
}
}
myLog('log statement');
myLog('logging an object', { name: 'Marcus', likes: 'js' });
这个组合起来相当仓促,有点草率,但它仍然很有用,并且可以轻松改进!
我希望将此作为评论添加到 Marcus Westin 的回复中,但我找不到链接 - 也许我需要更多声誉?
无论如何,谢谢,我发现这段代码片段对于在 IE 中进行快速调试很有用。我进行了一些快速调整以解决一个使其停止工作的问题,还自动向下滚动并使用固定定位,以便它会出现在视口中。这是我的版本,以防有人发现它有用:
myLog = function() {
var _div = null;
this.toJson = function(obj) {
if (typeof window.uneval == 'function') { return uneval(obj); }
if (typeof obj == 'object') {
if (!obj) { return 'null'; }
var list = [];
if (obj instanceof Array) {
for (var i=0;i < obj.length;i++) { list.push(this.toJson(obj[i])); }
return '[' + list.join(',') + ']';
} else {
for (var prop in obj) { list.push('"' + prop + '":' + this.toJson(obj[prop])); }
return '{' + list.join(',') + '}';
}
} else if (typeof obj == 'string') {
return '"' + obj.replace(/(["'])/g, '\\$1') + '"';
} else {
return new String(obj);
}
};
this.createDiv = function() {
myLog._div = document.body.appendChild(document.createElement('div'));
var props = {
position:'fixed', top:'10px', right:'10px', background:'#333', border:'5px solid #333',
color: 'white', width: '400px', height: '300px', overflow: 'auto', fontFamily: 'courier new',
fontSize: '11px', whiteSpace: 'nowrap'
}
for (var key in props) { myLog._div.style[key] = props[key]; }
};
if (!myLog._div) { this.createDiv(); }
var logEntry = document.createElement('span');
for (var i=0; i < arguments.length; i++) {
logEntry.innerHTML += this.toJson(arguments[i]) + '<br />';
}
logEntry.innerHTML += '<br />';
myLog._div.appendChild(logEntry);
// Scroll automatically to the bottom
myLog._div.scrollTop = myLog._div.scrollHeight;
}