2007/12/23更新创意无限,简单实用(javascript log)
发布时间:2024-04-26 17:11:46
在javascript开发过程中,如果总是使用alert的方式调试程序,在某些简单的程序中是可行的.
但是在通常的项目很复杂,这种方式已经很难满足,企业级开发的需要。
比如ajax项目中,存在一个3000行左右JS文件,其中存在各种自定义的javascript对象。
开发的过程中,总是需要在js程序执行到某个关键点的时候,监视自定义对象的值或状态,
判断执行结果是否是预期的样子,如果您通过alert看到某些关联对象的值,是很困难的。
存在以下两个明显的缺点:
1.假如一次执行中有n个关键点的值都想随时监视,使用alert您就不的不点够n次确认,给开发者的感觉是很不连贯也不直观,很难流畅发现隐藏很深的问题。
2.用于调试的alert语句,在发布的时候必须删除掉,等有朝一日需要再次调试的时候,您就不得不回忆之前的关键点,分别加上alert,艰难的调试。
使用该工具之后,以上两个问题,变得迎刃而解。
鉴于以上需求,本人本着简单实用的原则,
自己动手编写了这个javascript调试工具,全部程序只有300kb左右。
该工具主要有以下特点:
1.完全的可插入式思想,对目标程序没有任何负作用。
2.使用方法简单,方便,只需要引入一行JS代码。
使用后,您或许会发现,调试JS程序变的便利。
//----------------------------------使用方法---------------------------------------------//
步骤1.将下载后JSDebugTool.zip,解压到任意目录,比如:D:\tools\JSDebugTool
步骤2.将类似于下面这样的一行JS代码加入到您的目标程序(JSP,ASP,HTML,PHP等)中,下面的写法都是支持的.
<!-- debug功能不开启、不显示time、使用相对路径引入debugInner.file-->
<SCRIPT language=javascript debug=false showtime=false src="../JSDebugTool/debugInner.file"></script>
<!-- debug功能开启、显示time、使用WEB路径引入debugInner.file-->
<SCRIPT language=javascript debug=true showtime=true src="http://localhost:8080/myproject/JSDebugTool/debugInner.file"></script>
<!-- debug功能开启、不显示time、使用本地绝对路径引入debugInner.file-->
<SCRIPT language=javascript src="D:/tools/JSDebugTool/debugInner.file"></script>
※注释:
debug=true/false
true : Javascript debug 功能开启,默认值.(Development)
false : Javascript debug 功能关闭.(Release)
不设定"debug"参数时,默认为true.
src属性可以设定为(绝对路径、相对路径、WEB路径等)
debugInner.file : 采用嵌入模式模式
showtime=true/false
true : 在每条debug信息前显示当前时间。
false : 不显示当前时间,只显示debug信息。
不设定"showtime"参数时,默认为false.
url属性 可以为目标页面的url,比如http://www.baidu.com
-当设置了url参数时,将url指向的网页的innerHTML加入到targetpage div中
步骤3.测试代码如下:
<!--TEST begin-->
<script>
function test(){
var head = document.getElementsByTagName('HEAD').item(0);
jslog(null,"red");//null
jslog(1/3,"red");//number
jslog(1==2,"red");//boolean
jslog(test,"blue");//function
jslog("hello world!","red");//string
jslog(head);//object
}
</script>
<input type="button" value="TEST" >
<!--TEST end-->
项目庞大的时候,需要总是在程序中保留一些调试信息,必要的时候进行调试。
所以,能够让关键点的信息随时打印出来也是很重要的,同时保证在Release之后,对目标脚本执行性能没有任何影响是必须要考虑的问题。
本工具提供的print接口是:jslog(msg,color);//msg:信息 color:信息的颜色
如果release的时候,你希望将"步骤2"加入到目标程序中的JS删除,也可以在您的程序中重构一个方法,名字随意.比如:
function out(msg,color){
if(jslog) jslog(msg,color);
}
统一使用自己的定义的方法也可以,比如:
function test(){
out(null,"red");//null
out(1/3,"red");//number
out(1==2,"red");//boolean
out(test,"blue");//function
out("hello world!","red");//string
}
不过通常来说Release的时候将debug开关设置为:debug=false,不需要删除目标程序中的调试代码,对目标JS程序执行性能无任何影响;需要再次调试时,只需要将debug开关设置为:debug=true 即可.
//----------------------------------最新下载---------------------------------------//
下载(2007/12/23 更新): http://www.box.net/shared/bc3s1hdkw0
//----------------------------------更新履历---------------------------------------//
2007/12/23 更新:(目前共15K)
1.对jslog中的内部事件进行统一管理.内测阶段,留了一个测试"取消事件注册"的接口-通过双击console 可以调用
2.debugInner页面布局调整,使debugInner中的console浮动、可拖动、可调整宽度.在console中top和left小于40的部位可拖。
说明: 希望能趋于简单,实用,不喜欢臃肿的。今后只更新debugInner,不再更新debugPopup
猜你喜欢
- 一、模板图像处理(1)灰度图、二值图转化template = cv2.imread('C:/Users/bwy/Desktop/nu
- 本文实例讲述了Python及Django框架生成二维码的方法。分享给大家供大家参考,具体如下:一、包的安装和简单使用1.1 用Python来
- 大家在打开带有图片的网页时,有时会看到这样的情况:当鼠标指向图片的不同部位时,可以打开不同的超链接,这
- 前言很多时候需要对自己模型进行性能评估,对于一些理论上面的知识我想基本不用说明太多,关于校验模型准确度的指标主要有混淆矩阵、准确率、精确率、
- 以下的实例为去除指定表中数据类型是VARCHAR,CHAR,NVARCHAR的字段值中的不可见字符。 注释:此处只去掉前后的不可见字符,不包
- python对Ref文档进行去重首先将txt文档提取到Excel表格中筛选出重复项,并且整理到txt中:需要去重的目标txt也准备好:接下来
- Qt Designer用于像VC++的MFC一样拖放、设计控件PyUIC用于将Qt Designer生成的.ui文件转换成.py文件Qt D
- 前言今天为大家介绍一个利用Python模拟登陆CSDN的案例,虽然看起来很鸡肋,有时候确会有大用处,在这里就当做是一个案例练习吧,提高自己的
- 数据库中IP地址数据该怎么存?或许你已经不止一次遇到过这类问题,怎么存?varchar(255)不就完事儿了?坦白说,在我经历的几个项目中,
- 本文实例讲述了Python实现的对一个数进行因式分解操作。分享给大家供大家参考,具体如下:在数学中,我们可能会对一个数进行因式分解,如何用P
- CREATE OR REPLACE PROCEDURE PROCSENDEMAIL(P_TXT &
- 引言最常见的闭包 (Closure) 范式大家都很熟悉了:(function() {// ...})(); 很
- 码代码时,有时候需要根据比较大小分别赋值:import randomseq = [random.randint(0, 1000) for _
- pandas按照多列排序ascending代码示例:import pandas as pd#读取文件df = pd.read_csv(
- SQL Update常见写法Oralce和DB2都支持的语法:update test1?set (test1.name,test1.age)
- 前言Java 中最通用的日志模块莫过于 Log4j 了,在 python 中,也自带了 logging 模块,该模块的用法其实和 Log4j
- 一、什么是上下文管理器我们在处理文件的时候经常看到下面这样的代码,它即是上下文管理器:with open('test.txt'
- CSSer与其他IT职位一样,在找工作的时候,都会面临着面试官提出的问题,或者给出的试卷。一、超链接点击过后hover样式就不出现的问题?被
- 一般而言下面的就可以完成需求了。def convertToDic(data): jsonDic=json.loads(data) retur
- python是一门灵活的语言,也可以说python是一门胶水语言,顾名思义,就是其可以导入各类的包,python的包可以说是所有语言中最多的