阿林`alinBlog

 兼容FireFox/IE的insertAdjacentHTML方法

阿林, 发表于:2009-01-18 14:40:19, 分类:asp 浏览( ) 评论( )  收藏这篇日志

 

加html内容(insertAdjacentHTML和insertAdjacentText)
     dhtml提供了两个方法来进行添加,insertAdjacentHTML和insertAdjacentText
insertAdjacentHTML方法:在指定的地方插入html标签语句。
     原型:insertAdjacentHTML(swhere,stext)
     参数:
     swhere:指定插入html标签语句的地方,有四种值可以用:
               1.beforeBegin:插入到标签开始前
               2.afterBegin:插入到标签开始标记后
               3.beforeEnd:插入到标签结束标记前
               4.afterEnd:插入到标签结束标记后
               stext:要插入的内容

引用内容
以下为Ext的实现方法

方法名称:insertHtml(where,el,html)

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

源码如下:

<script type=“text/javascript“>
  <!–
    function insertHtml(where, el, html){
        where = where.toLowerCase();
        if(el.insertAdjacentHTML){
            switch(where){
                case “beforebegin“:
                    el.insertAdjacentHTML(’BeforeBegin’, html);
                    return el.previousSibling;
                case “afterbegin“:
                    el.insertAdjacentHTML(’AfterBegin’, html);
                    return el.firstChild;
                case “beforeend“:
                    el.insertAdjacentHTML(’BeforeEnd’, html);
                    return el.lastChild;
                case “afterend“:
                    el.insertAdjacentHTML(’AfterEnd’, html);
                    return el.nextSibling;
            }
            throw ’Illegal insertion point -> “‘ + where + ’“‘;
        }
  var range = el.ownerDocument.createRange();
        var frag;
        switch(where){
             case “beforebegin“:
                range.setStartBefore(el);
                frag = range.createContextualFragment(html);
                el.parentNode.insertBefore(frag, el);
                return el.previousSibling;
             case “afterbegin“:
                if(el.firstChild){
                    range.setStartBefore(el.firstChild);
                    frag = range.createContextualFragment(html);
                    el.insertBefore(frag, el.firstChild);
                    return el.firstChild;
                }else{
                    el.innerHTML = html;
                    return el.firstChild;
                }
            case “beforeend“:
                if(el.lastChild){
                    range.setStartAfter(el.lastChild);
                    frag = range.createContextualFragment(html);
                    el.appendChild(frag);
                    return el.lastChild;
                }else{
                    el.innerHTML = html;
                    return el.lastChild;
                }
            case “afterend“:
                range.setStartAfter(el);
                frag = range.createContextualFragment(html);
                el.parentNode.insertBefore(frag, el.nextSibling);
                return el.nextSibling;
            }
            throw ’Illegal insertion point -> “‘ + where + ’“‘;
    }

 

我试验了一下没成功,不知道哪里出问题了
于是又弄了一段代码,哈哈好使了,而且方便易用

引用内容
HTMLElement.prototype.insertAdjacentHTML=function(where, html){
           var e=this.ownerDocument.createRange();
           e.setStartBefore(this);
           e=e.createContextualFragment(html);
           switch (where) {
                    case 'beforeBegin': this.parentNode.insertBefore(e, this);break;
                    case 'afterBegin': this.insertBefore(e, this.firstChild); break;
                    case 'beforeEnd': this.appendChild(e); break;
                    case 'afterEnd':
                    if(!this.nextSibling) this.parentNode.appendChild(e);
                    else this.parentNode.insertBefore(e, this.nextSibling); break;
           }
};

 

 js
正在读取日志的评论数据,请稍后……
正在加载日志评论签写框,请稍后……
成员登录通道
正在载入成员登录通道...
添加文章到网摘

添加到网摘:

BLOG 日历助手
正在载入日历助手...
BLOG 分类列表
BLOG 统计信息
正在载入统计信息...
BLOG 站内搜索

BLOG 日志归档
BLOG 最新评论
{$SideComment}
BLOG 最新留言
{$SideGB}
BLOG 友情链接