1.在页面中引入js文件

官网:http://log4javascript.org/index.html

```javascript

<script src="http://cdn.bootcss.com/log4javascript/1.4.3/log4javascript.min.js"></script>
```
2.初始化
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<script type="text/javascript">
    //启用javascript 日志功能
    var logger = log4javascript.getLogger("main");
    log4javascript.setEnabled(false);
    var appender = new log4javascript.InPageAppender();
  appender.layout.pattern='%d{yyyy-MM-dd HH:mm:ss,SSS} [%c] %-5p - %m{1}%n';
    appender.visible=false;
    logger.addAppender(appender);
    logger.debug("This is a debugging message from the log4javascript in-page page");
     
    document.onkeydown = function(evt) {
         var VK_F9=120;
         //兼容IE和Firefox获得keyBoardEvent对象
         var evt = (evt) ? evt : ((window.event) ? window.event : "");
         //兼容IE和Firefox获得keyBoardEvent对象的键值
         var key = evt.keyCode?evt.keyCode:evt.which;
        if(evt.ctrlKey && evt.altKey && key == VK_F9){
            if(appender.visible){
                log4javascript.setEnabled(false);
                logger.info("隐藏记录日志.");
                appender.hide();
                appender.visible=false;
            }else{
                log4javascript.setEnabled(true);
                logger.info("显示记录日志.");
                appender.show();
                appender.visible=true;
            }
             
        }  
    };
 
</script>

3.总结
现在你就可以在页面上通过 Ctrl+Alt+F9 来开始/显示js日志 或结束/隐藏js日志

效果图:

 

javascript日志框架使用的更多相关文章

  1. Javascript单元测试框架比较Qunit VS Jasmine

    Javascript单元测试框架比较Qunit VS Jasmine 工欲行其事必先利其器,好的单元测试框架是TDD成功的一半.Javascript优秀的测试框架很多, 包括Jasmine,Qunit ...

  2. javascript单元测试框架mochajs详解

    关于单元测试的想法 对于一些比较重要的项目,每次更新代码之后总是要自己测好久,担心一旦上线出了问题影响的服务太多,此时就希望能有一个比较规范的测试流程.在github上看到牛逼的javascript开 ...

  3. 解读ASP.NET 5 & MVC6系列(9):日志框架

    框架介绍 在之前的.NET中,微软还没有提供过像样的日志框架,目前能用的一些框架比如Log4Net.NLog.CommonLogging使用起来多多少少都有些费劲,和java的SLF4J根本无法相比. ...

  4. JavaScript单元测试框架JsUnit基本介绍和使用

    JavaScript单元测试框架JsUnit基本介绍和使用 XUnit framework XUnit是一套标准化的独立于语言的概念和结构集合,用于编写和运行单元测试(Unit tests). 每一个 ...

  5. Java日志框架:SLF4J,Common-Logging,Log4J,Logback说明

    Log4j  Apache的一个开放源代码项目,通过使用Log4j,我们可以控制日志信息输送的目的地是控制台.文件.GUI组件.甚至是套接口服务 器.NT的事件记录器.UNIX Syslog守护进程等 ...

  6. java日志框架slf4j与log4j

    日志记录自然是非常重要的,但恐怕能记住slf4j与log4j等日志框架配置的人就很少了,这个东西不难,只是配置好后很少会去动它,开发新项目一般也是从其他项目拷贝,或者参照文档 废话不多说,先说log4 ...

  7. 一个简单的、面向对象的javascript基础框架

    如果以后公司再能让我独立做一套新的完整系统,那么我肯定会为这个系统再写一个前端框架,那么我到底该如何写这个框架呢? 在我以前的博客里我给大家展示了一个我自己写的框架,由于当时时间很紧张,做之前几乎没有 ...

  8. 12种JavaScript MVC框架之比较

    Gordon L. Hempton是西雅图的一位黑客和设计师,他花费了几个月的时间研究和比较了12种流行的JavaScript MVC框架,并在博客中总结了每种框架的优缺点,最终的结果是,Ember. ...

  9. Moon转告给你一个比Log4net更好日志框架--TracerX Logger 及其对应的日志查看器

    一.介绍 TracerX logger是一个易于上手,且拥有众多高级特性的.NET日志框架. 它能够发送输出结果到多目的地(循环文件.事件日志等....).它也能生成文本和二进制文件.它拥有一个强大的 ...

随机推荐

  1. 九度OJ 1452 搬寝室 -- 动态规划

    题目地址:http://ac.jobdu.com/problem.php?pid=1452 题目描述: 搬寝室是很累的,xhd深有体会.时间追述2006年7月9号,那天xhd迫于无奈要从27号楼搬到3 ...

  2. IOS 学习笔记 2015-04-08 OC-NSUserDefaults 持久化对象

    NSUserDefaults适合存储轻量级的本地数据,比如要保存一个登陆界面的数据,用户名.密码之类的; NSUserDefaults被设计用来存储设备和应用的配置信息,它通过一个工厂方法返回默认的. ...

  3. 虚拟机环境Centos如何上网

    虚拟机环境Centos如何上网----------by ruffianfish.痞子鱼 因为我是用的虚拟机的环境,所以一切操作角度从虚拟机出发. 虚拟机环境的优点: 适合新手学习linux 永远不要怕 ...

  4. TDirectory.GetAttributes、TDirectory.SetAttributes获取和设置文件夹属性

    使用函数: System.IOUtils.TDirectory.GetAttributes//获取属性 System.IOUtils.TDirectory.SetAttributes//设置属性 注: ...

  5. delphi cxgrid导出excel去除货币符号

    版本 : devexpress 13.1.4 打开 包在ExpressExportLibary目录中.  修改FCells.SetCellDataCurrency为FCells.SetCellData ...

  6. WPF中将四个数字字符串值(比如:"10,10,300,300")转为Rect

    RectConverter rectConverter = new RectConverter(); string parseString = viewportEntry.Text; if (pars ...

  7. nRF52系列——nRF52832来袭

    nRF52系列——nRF52832来袭 Nordic凭借着在无线技术的数十年深耕,推出第一个μBlue芯片-- nRF8001.其低功耗等特性在当时吸引了无数厂商的目光,并将这产品应用到多个领域,再之 ...

  8. 编程范式感想(一)——在C中进行对模板功能的实现

    最近一直在看网易公开课上的编程范式的公开课,斯坦福的教授讲的真的非常到位,感觉还是要好好学习下C还有汇编,熟悉下计算机的内存机制什么的. 大家都知道关于模板或者说范式的问题,基本在很多高级语言上都有实 ...

  9. Django中国|Django中文社区——python、django爱好者交流社区

    Django中国致力于成为Python和Django框架等技术的中文开发者学习交流平台. 内容涵盖python教程.python基础.Django教程.python入门.web.py教程.linux教 ...

  10. Visual Studio Code扩展

    Visual Studio Code扩展 注:本文提到的代码示例下载地址>How to create a simple extension for VS Code VS Code 是微软推出的一 ...