• FF下支持IE特有的insertAdjacentElement以及insertAdjacentHTML


    网摘:

    在ie下这连个函数主要是向目标元素对象插入一个新的子元素,子元素可以使element也可以是html代码片段

    由于FF中没有这两个函数,因此我们可以通过扩展HTMLElement来解决这个问题:

    if(typeof HTMLElement!="undefined" && !HTMLElement.prototype.insertAdjacentElement)
    {
         HTMLElement.prototype.insertAdjacentElement = function(where,parsedNode)
         {
            switch (where)
            {
                case 'beforeBegin':
                    this.parentNode.insertBefore(parsedNode,this)
                    break;
                case 'afterBegin':
                    this.insertBefore(parsedNode,this.firstChild);
                    break;
                case 'beforeEnd':
                    this.appendChild(parsedNode);
                    break;
                case 'afterEnd':
                    if (this.nextSibling) this.parentNode.insertBefore(parsedNode,this.nextSibling);
                        else this.parentNode.appendChild(parsedNode);
                    break;
             }
         }
    
         HTMLElement.prototype.insertAdjacentHTML = function (where,htmlStr)
         {
             var r = this.ownerDocument.createRange();
             r.setStartBefore(this);
             var parsedHTML = r.createContextualFragment(htmlStr);
             this.insertAdjacentElement(where,parsedHTML)
         }
    
         HTMLElement.prototype.insertAdjacentText = function (where,txtStr)
         {
             var parsedText = document.createTextNode(txtStr)
             this.insertAdjacentElement(where,parsedText)
         }
    }

    使用的方法很简单:

        if(e.insertAdjacentElement)
            {
                e.insertAdjacentElement("beforeEnd" , el);
            }
            else
            {
                e.insertAdjacentHTML("beforeEnd" , el.outerHTML);
            }
  • 相关阅读:
    ActiveMQ中JMS的可靠性机制
    ActiveMQ中Broker的应用与启动方式
    ActiveMQ支持的传输协议
    ActiveMQ常见消息类型
    Oracle体系结构及备份(十六)——bg-ckpt
    PHP自学之路---雇员管理系统(1)
    UVa11187
    给Android组件添加事件一个很好用的方法
    【项目那些事儿】项目哪些事儿?
    struts2对拦截器使用带实例
  • 原文地址:https://www.cnblogs.com/tatame/p/2777185.html
Copyright © 2020-2023  润新知