IE6789浏览器使用console.log类似的方法输出调试内容但又不影响页面正常运行
问题来源:外网IE下,触发js报错。经检测,未清除console造成。清除console后,解决。
问题原因:console.log 原先是 Firefox 的“专利”,严格说是安装了 Firebugs 之后的 Firefox 所独有的调试“绝招”。 这一招,IE8 学会了,不过用起来比 Firebugs 麻烦,只有在开启调试窗口(F12)的时候,console.log 才能出结果,不然就报错。
详细出处参考:http://www.jb51.net/article/30469.htm
解决问题:http://q.cnblogs.com/q/33770/ http://icant.co.uk/sandbox/fauxconsole/
1:Complete cross-browser console.log(),兼容几乎所有浏览器的代码
/ Tell IE9 to use its built-in console
if (Function.prototype.bind && console && typeof console.log == "object") {
["log","info","warn","error","assert","dir","clear","profile","profileEnd"]
.forEach(function (method) {
console[method] = this.call(console[method], console);
}, Function.prototype.bind);
}
// log() -- The complete, cross-browser (we don't judge!) console.log wrapper for his or her logging pleasure
if (!window.log) {
window.log = function () {
log.history = log.history || []; // store logs to an array for reference
log.history.push(arguments);
// Modern browsers
if (typeof console != 'undefined' && typeof console.log == 'function') {
// Opera 11
if (window.opera) {
var i = 0;
while (i < arguments.length) {
console.log("Item " + (i+1) + ": " + arguments[i]);
i++;
}
}
// All other modern browsers
else if ((Array.prototype.slice.call(arguments)).length == 1 && typeof Array.prototype.slice.call(arguments)[0] == 'string') {
console.log( (Array.prototype.slice.call(arguments)).toString() );
}
else {
console.log( Array.prototype.slice.call(arguments) );
}
}
// IE8
else if (!Function.prototype.bind && typeof console != 'undefined' && typeof console.log == 'object') {
Function.prototype.call.call(console.log, console, Array.prototype.slice.call(arguments));
}
// IE7 and lower, and other old browsers
else {
// Inject Firebug lite
if (!document.getElementById('firebug-lite')) {
// Include the script
var script = document.createElement('script');
script.type = "text/javascript";
script.id = 'firebug-lite';
// If you run the script locally, point to /path/to/firebug-lite/build/firebug-lite.js
script.src = 'https://getfirebug.com/firebug-lite.js';
// If you want to expand the console window by default, uncomment this line
//document.getElementsByTagName('HTML')[0].setAttribute('debug','true');
document.getElementsByTagName('HEAD')[0].appendChild(script);
setTimeout(function () { log( Array.prototype.slice.call(arguments) ); }, 2000);
}
else {
// FBL was included but it hasn't finished loading yet, so try again momentarily
setTimeout(function () { log( Array.prototype.slice.call(arguments) ); }, 500);
}
}
}
}
2:专门为ie下调试js用,Faux Console,使用方法:
2.1.引入css文件,及js文件
<link type="text/css" rel="stylesheet" href="fauxconsole.css" />
<script type="text/javascript" src="fauxconsole.js"></script>
//fauxconsole.css
#fauxconsole{
position:absolute;
top:;
right:;
width:300px;
border:1px solid #999;
font-family:courier,monospace;
background:#eee;
font-size:10px;
padding:10px;
}
html>body #fauxconsole{
position:fixed;
}
#fauxconsole a{
float:right;
padding-left:1em;
padding-bottom:.5em;
text-align:right;
}
//fauxconsole.js
/* Faux Console by Chris Heilmann http://wait-till-i.com */
if(!window.console){
var console={
init:function(){
console.d=document.createElement('div');
document.body.appendChild(console.d);
var a=document.createElement('a');
a.href='javascript:console.hide()';
a.innerHTML='close';
console.d.appendChild(a);
var a=document.createElement('a');
a.href='javascript:console.clear();';
a.innerHTML='clear';console.d.appendChild(a);
var id='fauxconsole';
if(!document.getElementById(id)){console.d.id=id;}
console.hide();
},hide:function(){
console.d.style.display='none';
},show:function(){
console.d.style.display='block';
},log:function(o){
console.d.innerHTML+='<br/>'+o;console.show();
},clear:function(){
console.d.parentNode.removeChild(console.d);
console.init();
console.show();
},/*Simon Willison rules*/
addLoadEvent:function(func){
var oldonload=window.onload;
if(typeof window.onload!='function'){
window.onload=func;
}else{
window.onload=function(){
if(oldonload){
oldonload();
}
func();
}
};
}
};
console.addLoadEvent(console.init);
}
- It tests if there is a
consoleobject defined - if there is one this means your browser has a console and the script does nothing else.
//看看有没有console对象定义,如果浏览器定义了console,嘛也不做。
- If
consoleisundefined, the script creates a new console object and adds a DIV to the body of the document.
//如果没有定义console,fauxconsole.js创建一个console对象,同时在 body中增加一个DIV.
- It adds a close and clear link to that
DIVwhich allow you to hide or wipe the console.
//给新增的DIV增加一个关闭,清除链接,这样,你就能隐藏或者展开console对话。
- It provides you with the following methods:
//JS提供了以下功能:
console.log(message)- adds message to the log //console.log(message)输出消息console.show()- shows the console //console.show() 展示consoleconsole.hide()- hides the console//console.hide()隐藏console
- The script adds the ID
fauxconsoleto theDIV(unless there is another element with that ID) and you can style the console using that. The preset CSSfauxconsole.cssis pretty basic and shows the console as a grey box fixed to the top right corner of the viewport.
//JS代码增加了一个ID fauxconsole 给那个新增的DIV(文档中不要有重复的ID,若重复,必须更换另一个ID名),通过定义fauxconsole,控制console.在fauxconsole.css中,默认console box固定在浏览器可见区域右上角,背景为灰色。
IE6789浏览器使用console.log类似的方法输出调试内容但又不影响页面正常运行的更多相关文章
- 前端不为人知的一面--前端冷知识集锦 前端已经被玩儿坏了!像console.log()可以向控制台输出图片
前端已经被玩儿坏了!像console.log()可以向控制台输出图片等炫酷的玩意已经不是什么新闻了,像用||操作符给变量赋默认值也是人尽皆知的旧闻了,今天看到Quora上一个帖子,瞬间又GET了好多前 ...
- console.log、toString方法与js判断变量类型
Java调用system.print.out()是会调用toString方法打印js里的console.log也是控制台打印,很多时候,我们以为也是调用toString方法,其实并不是.我们在chro ...
- 谷歌浏览器console.log()失效,打印不出来内容
这个问题困扰好几天了,网上说的都说的是下图: 勾选这三个就好了,但是我的本来就是勾选上的,还是不行. 后来发现这个: 把这个去掉就可以了,如下图: 原来是因为之前调试js的时候,使用了这个过滤,导致对 ...
- 【论文笔记】用反事实推断方法缓解标题党内容对推荐系统的影响 Click can be Cheating: Counterfactual Recommendation for Mitigating Clickbait Issue
Click can be Cheating: Counterfactual Recommendation for Mitigating Clickbait Issue Authors: 王文杰,冯福利 ...
- js的线程和同步异步以及console.log机制
项目上线了,闲下来就写写东西吧.积累了好多东西都没有做笔记~挑几个印象深刻的记录一下吧. js的同步异步以及单线程问题: 都知道单线程是js的一大特性.但是通常io(ajax获取服务器数据).用户/浏 ...
- JS之console.log详解以及兄弟姐们邻居方法扩展
console.log() 基本用法 console.log,前端常用它来调试分析代码,你可以在任何的js代码中调用console.log(),然后你就可以在浏览器控制台看到你刚才打印的常量,变量,数 ...
- console.log()方法中%s的作用
一.console.log("log信息"); 二.console.log("%s","first","second") ...
- js调试console.log使用总结图解
一 实例 打印字符串和对象: 可展开对象查看内部情况: 看一下console对象本身的定义情况: 输出对象情况: utag对象所在文件: 输出对象: 二 Console.log 总结 1 如果你j ...
- 如何实现监听 console.log
var lastLog; console.oldLog = console.log; console.log = function(str) { console.oldLog(str); lastLo ...
随机推荐
- HDU4607 Park Visit
肯定会想到树的直径: 如果直径够长,就在直径(1+8)上面找路径,ans=k. 如果不够长,肯定会在有点分叉点(如3,4,5)回溯,然后我们把路径拉直,把其中一条的作为主线(有机化学,ORZ),主线是 ...
- ElasticSearch(二):windows下ElasticSearch6.3.2插件Head的安装
前言 上一篇我们记录了如何安装ElasticSearch,这一篇我们来记录下如何安装Head插件 正文 方法总计有三种,但是安装ElasticSearch6.x的时候,只有一种完成了. 第一种:直接使 ...
- 【转】在Visual Studio中怎样快速添加代码段
原文网址:http://blog.csdn.net/yl2isoft/article/details/9735527 以前一直只知道,键入prop,再按两次tab键,会生成自动属性代码. 今天闲着无事 ...
- 【转】linux sed命令详解
原文网址:http://www.iteye.com/topic/587673 1. Sed简介sed 是一种在线编辑器,它一次处理一行内容.处理时,把当前处理的行存储在临时缓冲区中,称为“模式空间”( ...
- 一步搞定私有Git服务器部署(Gogs)
http://www.jianshu.com/p/424627516ef6 零.安装 Docker 和 Compsoe 首先安装 Docker: $ curl -sSL https://get.doc ...
- 黄聪:自定义WordPress前台、后台顶部菜单栏管理工具条的技巧
使用WordPress开发网站项目,很多时候都需要对进行后台定制,今天倡萌主要分享下自定义顶部管理工具条的使用技巧. 注:如无特殊说明,请将下面的代码添加到主题的 functions.php 或者插 ...
- pandas 的操作表单
最近做点东西,发现pandas处理表单那点东西都忘得差不多了,又花了半个小时过了一遍 import pandas as pdimport numpy as np data = pd.ExcelFile ...
- python + docker, 实现天气数据 从FTP获取以及持久化(四)-- 数据准备
前情提要 在之前的文章里,我们已经掌握从FTP上面下载天气数据然后插入到数据库中. 但是如何将我们已有的数据放到生产环境中呢? 思考 首先,我们先简单的理一理现在的情况. 目前: FTP上面已有半个月 ...
- MongoDB 3.0 常见集群的搭建(主从复制,副本集,分片....)
一.mongodb主从复制配置 主从复制是mongodb最常用的复制方式,也是一个简单的数据库同步备份的集群技术,这种方式很灵活.可用于备份,故障恢复,读扩展等. 最基本的设置方式就是建立一个主节 ...
- 8种常被忽视的SQL错误用法
作者:一杯甜酒 原文:https://blog.csdn.net/u012562943/article/details/71403500 sql语句的执行顺序: FROM <left_table ...