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. [翻译][MVC 5 + EF 6] 3:排序、过滤、分页

    原文:Sorting, Filtering, and Paging with the Entity Framework in an ASP.NET MVC Application 1.添加排序: 1. ...

  2. 多核处理器基础SMP&AMP&BMP

    多核处理器也称片上多核处理器(Chip Multi-Processor,CMP). 1.多核处理器的流行 多核出现前,商业化处理器都致力于单核处理器的发展,其性能已经发挥到极致,仅仅提高单核芯片的速度 ...

  3. c#解决数据库用in的时候大于1000报错问题

    问题: //oracle数据库报错 ,,,,,,,.....); c#写了一个方法解决 /// <summary> /// 拼接sql /// </summary> /// & ...

  4. ES6 语法简介

    参考: http://es6.ruanyifeng.com/ 总结学习 JavaScript语言下一代标准,2015年6月正式发布. 1.let和const命令 let用作变量声明,只在代码块内有效 ...

  5. PHP全局变量

    1.global 关键字 2.$GLOBALS 3.使用静态变量

  6. Linux-Tcp-IP

    /* tcpcli.c */ #include <stdio.h> #include <stdlib.h> #include <string.h> #include ...

  7. Python 命令行参数解析

    方法1: Python有一个类可以专门处理命令行参数,先看代码: #!/usr/bin/env python # encoding: utf-8 from optparse import Option ...

  8. SQL 多条件查询

    网上有不少人提出过类似的问题:“看到有人写了WHERE 1=1这样的SQL,到底是什么意思?”.其实使用这种用法的开发人员一般都是在使用动态组装的SQL.让我们想像如下的场景:用户要求提供一个灵活的查 ...

  9. [日语歌词] If

    原唱:西野カナ (にしのカナ) 作词:西野カナ/GIORGIO 13 作曲:GIORGIO CANCEMI 1.单词表 仮名 漢字 ひ 日 あめ 雨 や 止 ちがい 違い とおり 通り じかん 時間 ...

  10. 对指定文件生成数字摘要的MD5工具类

    md5特点:压缩性.不可逆性,经常用于传值过程中的值加密或文件加密static char hexdigits[] = { '0', '1', '2', '3', '4', '5', '6', '7', ...