用正则表达式 动态创建/增加css style script 兼容IE firefox


Posted in Javascript onMarch 10, 2009

str 是表示通过ajax返回的XMLRequest
/*动态加载css style*/
function loadStyle(str)
{
var regExp_src=/<style.*src\s*=\s*["'][^"']*["'].*>[^<>]*<\/style\s*>/gi;
var matchArray_src=str.match(regExp_src);
alert(matchArray_src[0]);
if(matchArray_src){
for(var i=0;i<matchArray_src.length;i++)
{alert("sss");
var str_temp = matchArray_src[i].toString();
var regExp_src_temp = /<style.*src\s*=\s*["']([^"']*)["'].*>[^<>]*<\/style\s*>/gi;
str_temp.match(regExp_src_temp);/*这里重复使用匹配是为了,$1这个子表达式指向当前的值,否则会永远是最后一个$1值*/
var head = document.getElementsByTagName('head')[0];
/*IE*/
if(document.all){
alert("IE");
if(document.getElementsByTagName('style')[0])
{
var sty=document.getElementsByTagName('style')[0].innerHTML;
alert(sty);
var sty = document.getElementsByTagName('style')[0].innerHTML;
//不知道怎么样取得IE当前的style标签,用getElementsByTagName不行,只能采此下策,创建一个新的,并加上以前的样式
var styleSheet = document.createStyleSheet();
styleSheet.cssText=sty+RegExp.$1;
}
else
{
var styleSheet = document.createStyleSheet();
styleSheet.cssText="body{background:red;}\<br\>"
alert("finished");
}
}
/*FIREFOX*/
else{
var style;
if(document.getElementsByTagName('style')[0])
{
var sty=document.getElementsByTagName('style')[0].innerHTML;
alert(sty);
document.getElementsByTagName('style')[0].innerHTML=sty+RegExp.$1;
}
else
style=document.createElement('style');
style.type = 'text/css';
style.innerHTML=RegExp.$1;
head.appendChild(style);
alert(RegExp.$1);
}
}
}
}
/*动态加载具有src属性的script*/
function loadScript_src(str){
var regExp_src=/<script.*src\s*=\s*["'][^"']*["'].*>[^<>]*<\/script\s*>/gi;
var matchArray_src=str.match(regExp_src);
if(matchArray_src)
{
for(var i=0;i<matchArray_src.length;i++)
{
var str_temp = matchArray_src[i].toString();
var regExp_src_temp = /<script.*src\s*=\s*["']([^"']*)["'].*>[^<>]*<\/script\s*>/gi;
str_temp.match(regExp_src_temp);
var head = document.getElementsByTagName('head')[0];
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = RegExp.$1;
script.defer="true";
head.appendChild(script);
alert(RegExp.$1);
}
}
}
/*动态加载innerHTML 中的Script*/
function loadScript(str){
var regExp_function=/<script[^>]*>([\s\S]*?)<\/script[\s]*>/gi;
var matchArray_function=str.match(regExp_function);
if(matchArray_function){
for(var i=0;i<matchArray_function.length;i++){
var str_temp=matchArray_function[i].toString();//其实用正则表达式的向前向后查找的话是很方便的,但javascript却不支持,所以只能采取此下策
var regExp_function_temp=/<script[^>]*>([\s\S]*?)<\/script[\s]*>/gi;
var matchArray_temp=str_temp.match(regExp_function_temp);
eval(RegExp.$1);
}
}
}

Javascript 相关文章推荐
对YUI扩展的Gird组件 Part-1
Mar 10 Javascript
让元素在网页中可拖动示例代码
Aug 13 Javascript
屏蔽IE弹出&quot;您查看的网页正在试图关闭窗口,是否关闭此窗口&quot;的方法
Dec 31 Javascript
JS数组的常见用法实例
Feb 10 Javascript
JS实现网页表格自动变大缩小的方法
Mar 09 Javascript
利用JavaScript脚本实现滚屏效果的方法
Jul 07 Javascript
JS+CSS实现经典的左侧竖向滑动菜单效果
Sep 23 Javascript
Vue.Draggable实现拖拽效果
Jul 29 Javascript
vue深入解析之render function code详解
Jul 18 Javascript
vue+layui实现select动态加载后台数据的例子
Sep 20 Javascript
Vue-cli打包后部署到子目录下的路径问题说明
Sep 02 Javascript
原生js 实现表单验证功能
Feb 08 Javascript
Iframe thickbox2.0使用的方法
Mar 05 #Javascript
js 颜色选择器(兼容firefox)
Mar 05 #Javascript
小型js框架veryide.librar源代码
Mar 05 #Javascript
兼容FireFox 的 js 日历 支持时间的获取
Mar 04 #Javascript
javascript radio 联动效果
Mar 04 #Javascript
js 页面执行时间计算代码
Mar 04 #Javascript
[推荐]javascript 面向对象技术基础教程
Mar 03 #Javascript
You might like
聊天室php&amp;mysql(二)
2006/10/09 PHP
PHP JSON 数据解析代码
2010/05/26 PHP
ini_set的用法介绍
2014/01/07 PHP
浅析php设计模式之数据对象映射模式
2016/03/03 PHP
thinkphp表单上传文件并将文件路径保存到数据库中
2016/07/28 PHP
支付宝支付开发――当面付条码支付和扫码支付实例
2016/11/04 PHP
PHP之多条件混合筛选功能的实现方法
2019/10/09 PHP
JXTree对象,读取外部xml文件数据,生成树的函数
2007/04/02 Javascript
使一个函数作为另外一个函数的参数来运行的javascript代码
2007/08/13 Javascript
Iframe自适应高度绝对好使的代码 兼容IE,遨游,火狐
2011/01/27 Javascript
js解析与序列化json数据(三)json的解析探讨
2013/02/01 Javascript
开发中可能会用到的jQuery小技巧
2014/03/07 Javascript
JQuery控制div外点击隐藏而div内点击不会隐藏的方法
2015/01/13 Javascript
JS实现slide文字框缩放伸展效果代码
2015/11/05 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
JS当前页面登录注册框,固定DIV,底层阴影的实例代码
2016/09/29 Javascript
探究JavaScript中的五种事件处理程序方式
2016/12/07 Javascript
node.js实现复制文本到剪切板的功能
2017/01/23 Javascript
JS+html5制作简单音乐播放器
2020/09/13 Javascript
jQuery插件实现弹性运动完整示例
2018/07/07 jQuery
详解关于vue2.0工程发布上线操作步骤
2018/09/27 Javascript
微信小程序的线程架构【推荐】
2019/05/14 Javascript
ES6中定义类和对象的方法示例
2019/07/31 Javascript
微信小程序sessionid不一致问题解决
2019/08/30 Javascript
python实现从字符串中找出字符1的位置以及个数的方法
2014/08/25 Python
Python实现Kmeans聚类算法
2020/06/10 Python
Python对ElasticSearch获取数据及操作
2019/04/24 Python
使用Python给头像戴上圣诞帽的图像操作过程解析
2019/09/20 Python
Pandas数据离散化原理及实例解析
2019/11/16 Python
Python基于数列实现购物车程序过程详解
2020/06/09 Python
html5关于外链嵌入页面通信问题(postMessage解决跨域通信)
2020/07/20 HTML / CSS
经理秘书找工作求职信
2013/12/19 职场文书
汽车维修专业自荐书
2014/05/26 职场文书
客户经理岗位职责
2015/01/31 职场文书
2016年社区植树节活动总结
2016/03/16 职场文书
Go获取两个时区的时间差
2022/04/20 Golang