zoukankan      html  css  js  c++  java
  • 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);
            }
  • 相关阅读:
    MySql 数据类型
    MySql 数据库的增删改
    MySql 联合查询
    Mysql 库的管理 --->>>>DDL
    MySql 子查询
    MySql 分页查询
    sql99语法的连接查询
    MySql 连接查询
    MySql 分组函数
    jQ处理页面中尺寸过大的图片
  • 原文地址:https://www.cnblogs.com/tatame/p/2777185.html
Copyright © 2011-2022 走看看