EXT2中一段兼容FF的insertAdjacentHTML方法

最新推荐文章于 2021-04-04 11:28:42 发布

最新推荐文章于 2021-04-04 11:28:42 发布 · 85 阅读

文章标签：

#Google #HTML #IE #EXT #JavaScript #ViewUI

本文介绍了一种在Firefox浏览器中实现HTML元素兼容性插入的方法，通过自定义insertHtml函数解决了不同浏览器间insertAdjacentHTML方法的差异问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

近日在搞一个关于多文件上传的组件,在IE内已实现了,并能成功动态的添加上传的附件.可是到FF下一测发觉没有任何反应.原来我使用的是insertAdjacentHTML.方法不行.想起EXT2中有一段关于兼容FF的insertAdjacentHTML方法.就去COPY过来了.

<scripttype="text/javascript">
<!--
functioninsertHtml(where,el,html){
where=where.toLowerCase();
if(el.insertAdjacentHTML){
switch(where){
case"beforebegin":
el.insertAdjacentHTML('BeforeBegin',html);
returnel.previousSibling;
case"afterbegin":
el.insertAdjacentHTML('AfterBegin',html);
returnel.firstChild;
case"beforeend":
el.insertAdjacentHTML('BeforeEnd',html);
returnel.lastChild;
case"afterend":
el.insertAdjacentHTML('AfterEnd',html);
returnel.nextSibling;
}
throw'Illegalinsertionpoint->"'+where+'"';
}
varrange=el.ownerDocument.createRange();
varfrag;
switch(where){
case"beforebegin":
range.setStartBefore(el);
frag=range.createContextualFragment(html);
el.parentNode.insertBefore(frag,el);
returnel.previousSibling;
case"afterbegin":
if(el.firstChild){
range.setStartBefore(el.firstChild);
frag=range.createContextualFragment(html);
el.insertBefore(frag,el.firstChild);
returnel.firstChild;
}else{
el.innerHTML=html;
returnel.firstChild;
}
case"beforeend":
if(el.lastChild){
range.setStartAfter(el.lastChild);
frag=range.createContextualFragment(html);
el.appendChild(frag);
returnel.lastChild;
}else{
el.innerHTML=html;
returnel.lastChild;
}
case"afterend":
range.setStartAfter(el);
frag=range.createContextualFragment(html);
el.parentNode.insertBefore(frag,el.nextSibling);
returnel.nextSibling;
}
throw'Illegalinsertionpoint->"'+where+'"';
}

参数介绍：
where：插入位置。包括beforeBegin,beforeEnd,afterBegin,afterEnd。
el：用于参照插入位置的html元素对象
html：要插入的html代码

一切OK.

最近在看EXT方面的资源.收获不少.各位有兴趣不妨多看看.