ie的一个调试方法，通过动态写入样式或者脚本

需求：我有好几次有这样一个需求，ie6，7等情况下。线上页面样式有问题。这时候需要更改某个样式。相当无奈。
没有firebug，蛋疼的ie下的webdeveloper等工具就是个垃圾。
我就只是想改个样式，就是没办法。这时候，我可以通过在页面上通过javascript:方式写入脚本，来调试样式。当然这样的调试只适合简单的需求。

代码如下：

function loadScriptUrl(url){
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = url;
    document.body.appendChild(script);
}

function loadScriptJs(js){
    var script = document.createElement('script');
    script.type = 'text/javascript';
    try{
        script.appendChild(document.createTextNode(js));
    }catch(e){
        script.text = js;
    }
    document.body.appendChild(script);
}

function loadStyleUrl(url){
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = url;
    document.getElementsByTagName('head')[0].appendChild(link);
}

function loadStyleCss(css){
    var style = document.createElement('style');
    style.type = 'text/css';
    try{
        style.appendChild(document.createTextNode(css))
    }catch(e){
        style.styleSheet.cssText = css;
    }
    document.getElementsByTagName('head')[0].appendChild(style);
}


function loadScriptUrl(url){var script=document.createElement('script');script.type='text/javascript';script.src=url;document.body.appendChild(script)}
function loadScriptJs(js){var script=document.createElement('script');script.type='text/javascript';try{script.appendChild(document.createTextNode(js))}catch(e){script.text=js}document.body.appendChild(script)}
function loadStyleUrl(url){var link=document.createElement('link');link.rel='stylesheet';link.type='text/css';link.href=url;document.getElementsByTagName('head')[0].appendChild(link)}
function loadStyleCss(css){var style=document.createElement('style');style.type='text/css';try{style.appendChild(document.createTextNode(css))}catch(e){style.styleSheet.cssText=css}document.getElementsByTagName('head')[0].appendChild(style)}

 

以上代码从上到下，依次是动态的，1加载js外部脚本地址，2加载直接写的js片段，3加载外部css地址，4加载css片段
下面4行是压缩过的上面的代码。方便直接复制到浏览器

下面是一个，使用第4种方式的，直接写css片段，内容写在最后一个括号里就可以了。
需要注意的是：
1 在ie6-8下，直接复制可使用
2 chrome，opera，ie9下需要手动输入javascript:。直接复制，会自动去掉javascript：
3 ff下无效，但是ff有了firebug根本就不需要了，这种调试方式了

javascript:(function loadStyleCss(css){var style=document.createElement('style');style.type='text/css';try{style.appendChild(document.createTextNode(css))}catch(e){style.styleSheet.cssText=css}document.getElementsByTagName('head')[0].appendChild(style)})();

 

参考资料：高级3

转载于:https://www.cnblogs.com/lunalord/archive/2012/05/23/2515227.html