让javascript中用innerHMTL添加的脚本运行起来
2012-02-21 12:27
351 查看
把加载回来的数据以innerHTML的方式放入到一个动态生成的Div中;
创建一个文档片段,把Div中的子元素都AppendChild到片段中;
选出文档片段中的Script节点;
把文档片段中的非Script节点添加到页面;
如果此节点存在src属性,那就再一次请求此src,并取回内容;如果此节点不存在src属性, 那就把此节点的文本内容取回;
取出DOM中的Head节点,再创建一个Script节点,设置节点Type属性为Text/javascript类型;
把第5步中取出的内容,添加到第6步创建的Script节点中,并把此节点插入为Head节点的第一个子节点;
删除Head节点中在第7步插入的Script节点;
实现
Js代码
/**
* 添加innerHTML到节点中
* @param elem 节点
* @param html HTMLCode
*/
JS.innerHTML = function( elem , html ){
/* 生成一个动态 */
var dynDiv = document.createElement( 'div' );
/* 把内容都添加到此div中 , 因为如果第一个节点为script时ie会忽略此节点,所以就要上面加一个新节点 */
dynDiv.innerHTML = '<span >for ie</span>'+html;
/* 取出动态div中的script节点 */
var scripts = dynDiv.getElementsByTagName('script');
/* 取出head节点,再新生成的节点添加到head中 */
var head = document.getElementsByTagName('head')[0];
/* 把script中的脚本或要引入的外部 脚本 */
for( var i=0;i<scripts.length;i++ ){
var jsCode = '';
/* 如果为外部脚本,就再去加载数据 */
if( scripts[i].src ){
JS.ajax( {
url : scripts[i].src,
type : 'get',
success : function( respon ){
jsCode = respon.responseText;
evalJs( jsCode );
}
} );
/* 如果只是内部脚本,就取出程序代码 */
}else{
jsCode = scripts[i].innerText || scripts[i].textContent || scripts[i].text || '';
evalJs( jsCode );
}
}
function evalJs( jsCode ){
/* 新建一个script节点 */
var scpt = document.createElement('script');
scpt.type='text/javascript';
scpt.text = jsCode;
head.insertBefore( scpt ,head.firstChild );
head.removeChild( scpt );
}
/* 删除内容中的script节点 */
for( var i=0;i<scripts.length;i++ ){
if( scripts[0].parentNode ){
scripts[0].parentNode.removeChild( scripts[0] );
i--;
}
}
elem.innerHTML = dynDiv.innerHTML;
}
创建一个文档片段,把Div中的子元素都AppendChild到片段中;
选出文档片段中的Script节点;
把文档片段中的非Script节点添加到页面;
如果此节点存在src属性,那就再一次请求此src,并取回内容;如果此节点不存在src属性, 那就把此节点的文本内容取回;
取出DOM中的Head节点,再创建一个Script节点,设置节点Type属性为Text/javascript类型;
把第5步中取出的内容,添加到第6步创建的Script节点中,并把此节点插入为Head节点的第一个子节点;
删除Head节点中在第7步插入的Script节点;
实现
Js代码
/**
* 添加innerHTML到节点中
* @param elem 节点
* @param html HTMLCode
*/
JS.innerHTML = function( elem , html ){
/* 生成一个动态 */
var dynDiv = document.createElement( 'div' );
/* 把内容都添加到此div中 , 因为如果第一个节点为script时ie会忽略此节点,所以就要上面加一个新节点 */
dynDiv.innerHTML = '<span >for ie</span>'+html;
/* 取出动态div中的script节点 */
var scripts = dynDiv.getElementsByTagName('script');
/* 取出head节点,再新生成的节点添加到head中 */
var head = document.getElementsByTagName('head')[0];
/* 把script中的脚本或要引入的外部 脚本 */
for( var i=0;i<scripts.length;i++ ){
var jsCode = '';
/* 如果为外部脚本,就再去加载数据 */
if( scripts[i].src ){
JS.ajax( {
url : scripts[i].src,
type : 'get',
success : function( respon ){
jsCode = respon.responseText;
evalJs( jsCode );
}
} );
/* 如果只是内部脚本,就取出程序代码 */
}else{
jsCode = scripts[i].innerText || scripts[i].textContent || scripts[i].text || '';
evalJs( jsCode );
}
}
function evalJs( jsCode ){
/* 新建一个script节点 */
var scpt = document.createElement('script');
scpt.type='text/javascript';
scpt.text = jsCode;
head.insertBefore( scpt ,head.firstChild );
head.removeChild( scpt );
}
/* 删除内容中的script节点 */
for( var i=0;i<scripts.length;i++ ){
if( scripts[0].parentNode ){
scripts[0].parentNode.removeChild( scripts[0] );
i--;
}
}
elem.innerHTML = dynDiv.innerHTML;
}
相关文章推荐
- 添加到收藏夹的Javascript脚本 for ie,firefox
- Linux系统中 eclipse下编译C++(使用v8引擎运行JavaScript脚本)
- 让innerHTML的脚本也可以运行起来
- JavaScript获取当前运行脚本文件所在目录的方法
- 让Ajax返回的innerHTML中的Javascript代码运行起来
- 解决IE里无法运行JavaScript脚本的方法
- JavaScript 脚本运行方式
- 不想让浏览器运行javascript脚本的方法
- C++程序通过SpiderMonkey也可以运行javascript脚本了
- 如何实现服务器端下页面动态添加JavaScript脚本
- 向Asp.net页面添加javascript脚本
- 【Hight Performance Javascript】——脚本加载和运行
- asp.net页面中动态地添加javascript脚本
- 让innerHTML的脚本也可以运行起来
- 百度MTC录制脚本导出到eclipse真正是怎么成功运行起来的!
- 添加到收藏夹的Javascript脚本 for ie,firefox
- mongodb在shell运行javascript脚本
- 让innerHTML的脚本也可以运行起来
- javascript innerHTML出现未知运行时错误
- Jsp页面里引入一个javascript文件,在jsp的onclick里怎么添加脚本文件里的方法