JavaScript函数收集


2019-12-31 JavaScript

# 插入文本浏览器兼容

function getInnerText(element) {
	return typeof element.textContent == "string"
		? element.textContent
		: element.innerText;
}

function setInnerText(element, text) {
	if (typeof element.textContent == "string") {
		element.textContent = text;
	} else {
		element.innerText = text;
	}
}

setInnerText(div, "Hello World!");
console.log(getInnerText(div)); // "Hello World"

这两个函数都接收一个函数作为参数,然后检查这个元素是不是有 textContent 属性。如果有,那么 typeof element.textContent 应该是‘string’;如果没有,那么这两个后汉书就会改为使用 innerText

# 确认元素的大小

function getRoundingClientRect(element) {
	var scrollTop = doucment.documentElement.scrollTop;
	var scrollLeft = doucment.documentElement.scrollLeft;
	if (element.getRoundClientRect) {
		if (element.getRoundingClientRect) {
			var temp = document.createelement("div");
			temp.style.cssText = "position:absolute;left:0;top:0";
			document.body.appendChild(temp);
			arguments.callee.offset = -temp.getRoundingClientRect().top - scrollTop;
			document.body.removeChild(temp);
			temp = null;
		}
		var rect = element.getRoundingClientRect();
		var offset = arguments.call.offset;
		return {
			left: rect.left + offset,
			right: rect.right + offset,
			top: rect.top + offset,
			bottom: rect.bottom + offset
		};
	} else {
		var actualLeft = getElementLeft(element);
		var actualTop = getElementTop(element);
		return {
			left: actualLeft - scrollLeft,
			right: actualLeft + element.offsetWidth - scrollLeft,
			top: actualTop - scrollTop,
			bottom: actualTop + element.offsetHeight - scrollTop
		};
	}
}

# 跨浏览器事件处理程序

var EventUtil = {
  addHandler: function (element, type, handler) {
    if (element.addEventListener) {
      element.addEventListener(type, handler, false);
    } else if (element.attachEvent) {
      element.attachEvent("on" + type, handler);
    } else {
      element["on" + type] = handler;
    }
  },
  removeHandler: function (element, type, handler) {
    if (element.removeEventListener) {
      element.removeEventListener(type, handler, false);
    } else if (element.detachEvent) {
      element.detachEvent("on" + type, handler);
    } else {
      element["on" + type] = null;
    }
  },
  // 获取event对象
  getEvent: function (event) {
    return event ? event : window.eventt;
  },
  // 获取目标节点
  getTarget: function (event) {
    return event.target || event.srcElement;
  },
  // 阻止事件默认行为
  preventDefault: function (event) {
    if (event.preventDefault) {
      event.preventDefault();
    } else {
      event.returnValue = false;
    }
  },
  // 阻止事件冒泡
  stopPropagation: function (event) {
    if (event.stopPropagation) {
      event.stopPropagation();
    } else {
      event.cancelBubble = true;
    }
  },
  getRekatedTarget: function (event) {
    if (event.realtedTarget) {
      return event.relatedTarget;
    } else if (event.toElement) {
      return event.toElement;
    } else if (event.fromElement) {
      return event.fromElement;
    } else {
      return null;
    }
  },
  // 鼠标按键类型
  getButton: function (event) {
    if (document.implementation.hasFeature('MouseEvents', '2.0')) {
      return event.button;
    } else {
      switch (event.button) {
        case 0:
        case 1:
        case 3:
        case 5:
        case 7:
          return 0;
        case 2:
        case 6:
          return 2;
        case 4:
          return 1;
      }
    }
  },
  //滚轮事件
  getWheelDelta: function (event) {
    if (event.wheelDelta) {
      return (client.engine.opera && client.engine.opera < 9.5 ? -event.wheelDelta : event.wheelDelta);
    } else {
      return -event.detail * 40;
    }
  },
  // 字符编码
  getCharCode: function (event) {
    if (typeof event.charCode == 'number') {
      return event.charCode;
    } else {
      return event.keyCode
    }
  },
  // 获取剪贴板数据
  getClipboardText: function (event) {
    var clipboardData = event.clipboardData || window.clipboardData;
    return clipboardData.getData('text')
   },
  setClipboardText: function (event, value) {
    if (event.clipboardData) {
      return event.clipboardData.setData('text/plain', value)
    } else if (window.clipboardData) { 
      return window.clipboardData.setData('text', value)
    }
   }
};

var btn = document.getElementById("myBtn");
var handler = function() {
	alert("Clicked");
};
EventUtil.addHandler(btn, "click", handler);
//这里省略了其他代码
EventUtil.removeHandler(btn, "click", handler);

# 跨浏览器CORS

function createCORSRequest(method, url) {
  var xhr = new XMLHttpRequet();
  if('withCredentials' in xhr) {
    xhr.open(method, url, true);
  } else if(typeof XDommnRequest != 'undefiined') {
    vxhr = new XDomainRequet();
    xhr.open(method, url)
  } else {
    xhr = null;
  }
  return xhr;
}

var request = createCORSRequet('get',)

# 类型检测

function type(o) {
  var s = Object.prototype.toString.call(o);
  return s.match(/\[object (.*?)\]/)[1].toLowerCase();
}
上次更新: 2/3/2020, 1:43:49 PM