创建兼容 IE/FireFox 的 insertAdjacentHTML 方法

在 IE 中我们可以用 insertAdjacentHTML 往元素的 beforeBegin,beforeEnd,afterBegin,afterEnd 处理插入新元素。而在非 IE 中没有该方法,因而我们要创造一个兼容的 insertHtml 方法来。

本方法从 Ext 2 中剥离出来的,在 ext-all-debug.js 中有以下方法:

Ext.DomHelper.insertHtml( String where, HTMLElement el, String html ) : HTMLElement

参数介绍:

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

测试代码:

上面代码在 IE、FireFox 和 Chrome 浏览器上测试均通过。分别选择 BeforeBegin、AfterBegin、BeforeEnd 和 AfterEnd 点击 Click Here 按钮后的效果图如下:

另外 Ext.Element 和 Ext.Layer 的 insertHtml 也是调用的 Ext.DomHelper.insertHtml 方法的。且 Ext 在此之上衍生了 insertAfter/inserBefore/insertFirst/insertSibling 方法。

参考:1. http://www.koyoz.com/blog/?action=show&id=2

 

类别: Web/JS. 标签: , . 阅读(486). 订阅评论. TrackBack.

Leave a Reply

Be the First to Comment!

avatar
wpDiscuz