贴一个在Mozilla中常用的Javascript代码

2016-02-19 10:54 6 1 收藏

人生本是一个不断学习的过程,在这个过程中,图老师就是你们的好帮手,下面分享的贴一个在Mozilla中常用的Javascript代码懂设计的网友们快点来了解吧!

【 tulaoshi.com - Web开发 】

Mozilla中独有的读写器(defineGetter、defineSetter)以及可以给Element,Event等加上prototype原型,使得在IE里用的方法同样在Mozilla中可以适用,下面贴出常用的一些代码
例如
obj.insertAdjacentHTML, currentStyle, obj.attachEvent, obj.detachEvent等等。

版权属于Erik Arvidsson, webfx

代码如下:
if (Browser.isMozilla) { // set up ie environment for Moz 

   

  extendEventObject(); 
  emulateAttachEvent(); 
  emulateEventHandlers(["click", "dblclick", "mouseover", "mouseout", 
              "mousedown", "mouseup", "mousemove", 
              "keydown", "keypress", "keyup"]); 

  emulateCurrentStyle(); 
  /*emulateDocumentAll(); 
  emulateElement() 
  */ 

  // It is better to use a constant for event.button 
  Event.LEFT = 0; 
  Event.MIDDLE = 1; 
  Event.RIGHT = 2; 

else { 
  Event = {}; 
  // IE is returning wrong button number 
  Event.LEFT = 1; 
  Event.MIDDLE = 4; 
  Event.RIGHT = 2; 


/* 
 * Extends the event object with srcElement, cancelBubble, returnValue, 
 * fromElement and toElement 
 */ 
function extendEventObject() { 
  Event.prototype.__defineSetter__("returnValue", function (b) { 
    if (!b) this.preventDefault(); 
    return b; 
  }); 

  Event.prototype.__defineSetter__("cancelBubble", function (b) { 
    if (b) this.stopPropagation(); 
    return b; 
  }); 

  Event.prototype.__defineGetter__("srcElement", function () { 
    var node = this.target; 
    while (node.nodeType != 1) node = node.parentNode; 
    return node; 
  }); 

  Event.prototype.__defineGetter__("fromElement", function () { 
    var node; 
    if (this.type == "mouseover") 
      node = this.relatedTarget; 
    else if (this.type == "mouseout") 
      node = this.target; 
    if (!node) return; 
    while (node.nodeType != 1) node = node.parentNode; 
    return node; 
  }); 

  Event.prototype.__defineGetter__("toElement", function () { 
    var node; 
    if (this.type == "mouseout") 
      node = this.relatedTarget; 
    else if (this.type == "mouseover") 
      node = this.target; 
    if (!node) return; 
    while (node.nodeType != 1) node = node.parentNode; 
    return node; 
  }); 

  Event.prototype.__defineGetter__("offsetX", function () { 
    return this.layerX; 
  }); 
  Event.prototype.__defineGetter__("offsetY", function () { 
    return this.layerY; 
  }); 


/* 
 * Emulates element.attachEvent as well as detachEvent 
 */ 
function emulateAttachEvent() { 
  HTMLDocument.prototype.attachEvent = 
  HTMLElement.prototype.attachEvent = function (sType, fHandler) { 
    var shortTypeName = sType.replace(/on/, ""); 
    fHandler._ieEmuEventHandler = function (e) { 
      window.event = e; 
      return fHandler(); 
    }; 
    this.addEventListener(shortTypeName, fHandler._ieEmuEventHandler, false); 
  }; 

  HTMLDocument.prototype.detachEvent = 
  HTMLElement.prototype.detachEvent = function (sType, fHandler) { 
    var shortTypeName = sType.replace(/on/, ""); 
    if (typeof fHandler._ieEmuEventHandler == "function") 
      this.removeEventListener(shortTypeName, fHandler._ieEmuEventHandler, false); 
    else 
      this.removeEventListener(shortTypeName, fHandler, true); 
  }; 


/* 
 * This function binds the event object passed along in an 
 * event to window.event 
 */ 
function emulateEventHandlers(eventNames) { 
  for (var i = 0; i  eventNames.length; i++) { 
    document.addEventListener(eventNames[i], function (e) { 
      window.event = e; 
    }, true);  // using capture 
  } 


/* 
 * Simple emulation of document.all 
 * this one is far from complete. Be cautious 
 */ 

function emulateAllModel() { 
  var allGetter = function () { 
    var a = this.getElementsByTagName("*"); 
    var node = this; 
    a.tags = function (sTagName) { 
      return node.getElementsByTagName(sTagName); 
    }; 
    return a; 
  }; 
  HTMLDocument.prototype.__defineGetter__("all", allGetter); 
  HTMLElement.prototype.__defineGetter__("all", allGetter); 


function extendElementModel() { 
  HTMLElement.prototype.__defineGetter__("parentElement", function () { 
    if (this.parentNode == this.ownerDocument) return null; 
    return this.parentNode; 
  }); 

  HTMLElement.prototype.__defineGetter__("children", function () { 
    var tmp = []; 
    var j = 0; 
    var n; 
    for (var i = 0; i  this.childNodes.length; i++) { 
      n = this.childNodes[i]; 
      if (n.nodeType == 1) { 
        tmp[j++] = n; 
        if (n.name) {  // named children 
          if (!tmp[n.name]) 
            tmp[n.name] = []; 
          tmp[n.name][tmp[n.name].length] = n; 
        } 
        if (n.id)    // child with id 
          tmp[n.id] = n 
      } 
    } 
    return tmp; 
  }); 

  HTMLElement.prototype.contains = function (oEl) { 
    if (oEl == this) return true; 
    if (oEl == null) return false; 
    return this.contains(oEl.parentNode); 
  }; 


function emulateCurrentStyle() { 
  HTMLElement.prototype.__defineGetter__("currentStyle", function () { 
    return this.ownerDocument.defaultView.getComputedStyle(this, null); 
    /* 
    var cs = {}; 
    var el = this; 
    for (var i = 0; i  properties.length; i++) { 
      cs.__defineGetter__(properties[i], encapsulateObjects(el, properties[i])); 
    } 
    return cs; 
    */ 
  }); 


function emulateHTMLModel() { 

  // This function is used to generate a html string for the text properties/methods 
  // It replaces 'n' with "BR" as well as fixes consecutive white spaces 
  // It also repalaces some special characters 
  function convertTextToHTML(s) { 
    s = s.replace(/&/g, "&").replace(//g, "").replace(//g, "").replace(/n/g, "BR"); 
    while (/ss/.test(s)) 
      s = s.replace(/ss/, "  "); 
    return s.replace(/s/g, " "); 
  } 

  HTMLElement.prototype.insertAdjacentHTML = function (sWhere, sHTML) { 
    var df;  // : DocumentFragment 
    var r = this.ownerDocument.createRange(); 

    switch (String(sWhere).toLowerCase()) { 
      case "beforebegin": 
        r.setStartBefore(this); 
        df = r.createContextualFragment(sHTML); 
        this.parentNode.insertBefore(df, this); 
        break; 

      case "afterbegin": 
        r.selectNodeContents(this); 
        r.collapse(true); 
        df = r.createContextualFragment(sHTML); 
        this.insertBefore(df, this.firstChild); 
        break; 

      case "beforeend": 
        r.selectNodeContents(this); 
        r.collapse(false); 
        df = r.createContextualFragment(sHTML); 
        this.appendChild(df); 
        break; 

      case "afterend": 
        r.setStartAfter(this); 
        df = r.createContextualFragment(sHTML); 
        this.parentNode.insertBefore(df, this.nextSibling); 
        break; 
    } 
  }; 

  HTMLElement.prototype.__defineSetter__("outerHTML", function (sHTML) { 
   var r = this.ownerDocument.createRange(); 
   r.setStartBefore(this); 
   var df = r.createContextualFragment(sHTML); 
   this.parentNode.replaceChild(df, this); 

   return sHTML; 
  }); 

  HTMLElement.prototype.__defineGetter__("canHaveChildren", function () { 
    switch (this.tagName) { 
      case "AREA": 
      case "BASE": 
      case "BASEFONT": 
      case "COL": 
      case "FRAME": 
      case "HR": 
      case "IMG": 
      case "BR": 
      case "INPUT": 
      case "ISINDEX": 
      case "LINK": 
      case "META": 
      case "PARAM": 
        return false; 
    } 
    return true; 
  }); 

  HTMLElement.prototype.__defineGetter__("outerHTML", function () { 
    var attr, attrs = this.attributes; 
    var str = "" + this.tagName; 
    for (var i = 0; i  attrs.length; i++) { 
      attr = attrs[i]; 
      if (attr.specified) 
        str += " " + attr.name + '="' + attr.value + '"'; 
    } 
    if (!this.canHaveChildren) 
      return str + ""; 

    return str + "" + this.innerHTML + "/" + this.tagName + ""; 
  }); 

  HTMLElement.prototype.__defineSetter__("innerText", function (sText) { 
    this.innerHTML = convertTextToHTML(sText); 
    return sText; 
  }); 

  var tmpGet; 
  HTMLElement.prototype.__defineGetter__("innerText", tmpGet = function () { 
    var r = this.ownerDocument.createRange(); 
    r.selectNodeContents(this); 
    return r.toString(); 
  }); 

  HTMLElement.prototype.__defineSetter__("outerText", function (sText) { 
    this.outerHTML = convertTextToHTML(sText); 
    return sText; 
  }); 
  HTMLElement.prototype.__defineGetter__("outerText", tmpGet); 

  HTMLElement.prototype.insertAdjacentText = function (sWhere, sText) { 
    this.insertAdjacentHTML(sWhere, convertTextToHTML(sText)); 
  }; 
}

来源:http://www.tulaoshi.com/n/20160219/1596080.html

延伸阅读
标签: Web开发
今天看到蓝色有人 问这个问题,偶就试着写了一个,感觉正则的replace+function方式挺方便简洁,代码如下: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
标签: Web开发
在日常的前端开发工作中,我们会经常的与HTML、javascript、css等语言打交道,和一门真正的语言一样,计算机语言也有它的字母表、语法、词法、编码方式等,在这里我简单的谈一下前端HTML与javascript日常工作中常碰到的编码问题。 在计算机中,我们储存的信息都是用二进制码表示的。我们认识的、屏幕上显示的英文、汉字等符号和储存用的二进制...
标签: Web开发
*{ margin:0px;padding:0px;font-size:12px; } input{ width:100px;height:20px;border:1px solid #ccc; } 姓名: 密码: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 比较简单,自己闲着无聊写的,很久没有写过代码了。。。。 
标签: Web开发
请选择报告类型 月度报告 季度报告 半年报告 年度报告 [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
标签: Web开发
点击返回上页代码: <form> <p><input TYPE="button" VALUE="返回上一步" ONCLICK="history.back(-1)"></p> </form> 弹出警告框代码: <form> <p><input TYPE="button" VALUE="弹出警告框" ONCLICK="AlertButton()"></p> </form> <script language="JavaScript"><!-- function AlertButton(){window.alert("要...

经验教程

17

收藏

99
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部