调试技术

zoomdong 发布于2019-08-20 11:57 / 2668人阅读

摘要：常见的方式是把调试信息记录到控制台，但是这涉及到浏览器的差异性。对和来说，则可以通过对象向控制台中写入消息，这个对象具有下列方法。

调试代码的一般方法就是让浏览器输出调试信息。常见的方式是把调试信息记录到控制台，但是这涉及到浏览器的差异性。最关键的是，在最终发布网页之前，这些调试代码必须都删除。
1）对 IE8、 Firefox、 Chrome 和 Safari 来说，则可以通过 console 对象向 JavaScript 控制台中写入消息，这个对象具有下列方法。这些方法适用于绝大多数调试。
 error(message)：将错误消息记录到控制台
 info(message)：将信息性消息记录到控制台
 log(message)：将一般消息记录到控制台
 warn(message)：将警告消息记录到控制台
2）Opera 10.5 之前的版本中， JavaScript 控制台可以通过 opera.postError()方法来访问。这个方法接受一个参数，即要写入到控制台中的参数，其用法如下。

function sum(num1, num2){
opera.postError("Entering sum(), arguments are " + num1 + "," + num2);
opera.postError("Before calculation");
var result = num1 + num2;
opera.postError("After calculation");
opera.postError("Exiting sum()");
return result;
}

3）Firefox、 Safari 和 Opera都支持 LiveConnect，因此可以操作 Java 控制台。例如，通过下列代码就可以在 JavaScript 中把消息写入到 Java 控制台。Java 控制台需要手动打开。
java.lang.System.out.println("Your message");

不存在一种跨浏览器向 JavaScript 控制台写入消息的机制，但下面的函数倒可以作为统一的接口。

function log(message) {
  if (typeof console == "object") {
    console.log(message);
  } else if (typeof opera == "object") {
    opera.postError(message);
  } else if (typeof java == "object" && typeof java.lang == "object") {
    java.lang.System.out.println(message);
  }
}

4）不支持 JavaScript 控制台的 IE7 及更早版本或其他浏览器中，可以使用另一种输出调试消息的方式，就是在页面中开辟一小块区域，用以显示消息。这个区域通常是一个元素，而该元素可以总是出现在页面中，但仅用于调试目的；也可以是一个根据需要动态创建的元素。
例如，可以将 log()函数修改为如下所示：

function log(message) {
  var console = document.getElementById("debuginfo");
  if (console === null) {
    console = document.createElement("div");
    console.id = "debuginfo";
    console.style.background = "#dedede";
    console.style.border = "1px solid silver";
    console.style.padding = "5px";
    console.style.width = "400px";
    console.style.position = "absolute";
    console.style.right = "0px";
    console.style.top = "0px";
    document.body.appendChild(console);
  }
  console.innerHTML += "" + message + "";
}

这个修改后的 log()函数首先检测是否已经存在调试元素，如果没有则会新创建一个

元素，并为该元素应用一些样式，以便与页面中的其他元素区别开。然后，又使用 innerHTML 将消息写入到这个

元素中。结果就是页面中会有一小块区域显示错误消息。

超融合服务器 idc机房托管实时调试网站调试无法调试在线调试

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80720.html

五种前端开发必备的调试技术

摘要：在前端开发中，调试技术是必不可少的技能，本文将介绍五种前端开发必备的调试技术。移动调试断点断点方法远程映射本地调试在移动上面开发调试是很复杂的，所以就有了。在前端开发中，调试技术是必不可少的技能，本文将介绍五种前端开发必备的调试技术。 Weinre移动调试 DOM 断点 debugger断点 native方法hook 远程映射本地调试 Weinre 在移动上面开...

张红新 2019-08-19 14:23 评论0 收藏0
视频编解码行业及发展方向简述

摘要：了解华为海思的方案海思的前身是华为的半导体部门，主要产品线包括智能手机处理器麒麟系列，视频采集和编解码处理器系列，无线通信方向芯片等。目录一、视频行业1、视频...

dance 2021-11-17 09:33 评论0 收藏0
AppHost：大前端融合下的 Hybrid 开发解决方案

摘要：接口管理独立于的版本号，使用特性嗅探实现新旧的兼容，简单直观。其中在网易有钱上使用了年多，支持了网易有钱的不断增长的业务需求，期间解决了很多遇到的通有的问题。目前还没有在线上系统中使用，目前正逐步将整体接入网易严选和网易推手。 showImg(https://upload-images.jianshu.io/upload_images/277783-33c33da3e99a070d.p...

XBaron 2019-08-23 17:06 评论0 收藏0
AppHost：大前端融合下的 Hybrid 开发解决方案

摘要：接口管理独立于的版本号，使用特性嗅探实现新旧的兼容，简单直观。其中在网易有钱上使用了年多，支持了网易有钱的不断增长的业务需求，期间解决了很多遇到的通有的问题。目前还没有在线上系统中使用，目前正逐步将整体接入网易严选和网易推手。 showImg(https://upload-images.jianshu.io/upload_images/277783-33c33da3e99a070d.p...

shleyZ 2019-06-25 17:17 评论0 收藏0
JavaScript 错误处理与调试——“调试技术与常见的IE错误”的注意要点

摘要：将消息记录到控制台和来说，可通过对象向控制台中写入消息。如常见的错误操作终止无效字符未找到成员未知运行时错误语法错误系统无法找到指定资源将消息记录到控制台 console IE8、Firefox、Chrome和Safari来说，可通过console对象向JavaScript控制台中写入消息。对象有下列方法： error(message)：将错误消息记录到控制台 info(messa...

GT 2019-08-19 17:37 评论0 收藏0