标签：11 function 兼容性 return 函数 javascript window 2020 var
兼容性说明
- document.getElementsByClassName 方法 ie8及以下不支持！
- querySelector querySelectorAll 是html5新引进的api ie6及一下不兼容 1. 性能不好 2. 不是实时的 （将某个元素选择出来后 删除元素 但数组中还有该元素）；
- children ie8及一下不支持
- parentElement childElementCount firstElementChild lastElementChild previousElementSibling nextElementSibling ie8及一下不支持
- append方法 ie所有版本不兼容 ！！！
- innerText 老版本火狐不支持（但是有textContent 可是ie老版本不支持） ！！
- window.pageXOffset/pageYOffset (常规，ie9某些版本和ie8及一下不支持 —> document.body.scrollLeft/scrollTop 或者 document.documentElement.scrollLeft/scrollTop)
- elem.addEventListener(eventType,fun,boolean) ie8及以下不支持 但是他是w3c规范 解决ie8及一下：elem.attachEvent(on + eventType,fun); ie10及以上无该方法
- 事件对象 （事件触发是会产生事件对象 fn(e) ）ie8及一下事件对象是存在window.event下的 —> var e = e || window.event
- 阻止冒泡：w3c规范：e.stopPropagation() ie8及以下不支持 解决—-> ie：e.cancelBubble = true
- 阻止默认行为：w3c规范： e.preventDefault(); ie9及一下不兼容； —> e.returnValue = false;
- 鼠标滚轮事件：onmousewheel e.wheelDelta ： 120的倍数 但是火狐不兼容—> DOMMouseWheel e.detail 3的倍数
兼容性工具函数
(function(window){
'use strict'
/***
* 返回指定计算样式
* @pram : elem:元素 , prop:元素的样式属性
*author: kaier
* time： 2020-11-1
*
*/
window.getStyle = function(elem,prop) {
var style = window.getComputedStyle;
if(style){
if(prop){
return style(elem,null)[prop];
} else {
return style(elem,null);
}
}else{
if(prop) {
return elem.currentStyle[prop];
} else {
return elem.currentStyle;
}
}
}
/***
* 返回所有子元素
* author： kaier
* time： 2020-11-2
*
*/
window.elemChild = function(node) {
var nodeList = node.childNodes,
len = nodeList.length,
arr = {
"length": 0,
"push": Array.prototype.push,
"splice": Array.prototype.splice
} ,
item;
for(var i = 0 ; i < len ; i++) {
item = nodeList[i];
if(item.nodeType === 1) {
arr.push(item);
}
}
return arr ;
}
/***
* 返回文档偏移量
* author： kaier
* time： 2020-11-3
*
*/
window.getScrollOffset = function(){
if(window.pageXOffset !== undefined){
return {
left:window.pageXOffset,
top:window.pageYOffset
}
}else{
return {
left: document.body.scrollLeft + document.documentElement.scrollLeft,
top: document.body.scrollTop + document.documentElement.scrollTop
}
}
}
/***
* 返回可视区域大小
* author： kaier
* time： 2020-11-3
*
*/
window.getViewSize = function() {
if(window.innerWidth !== undefined) {
return {
width: window.innerWidth,
height: window.innerHeight
}
} else {
if(document.compatMode === "BackCompat") {
return {
width: document.body.clientWidth,
height: document.body.clientHeight
}
} else {
return {
width: document.documentElement.clientWidth,
height: document.documentElement.clientHeight
}
}
}
}
/***
* 返回文档尺寸
* author： kaier
* time ： 2020-11-3
*
*/
window.getScrollSize = function() {
if(document.body.scrollHeight !==undefined){
return {
width: document.body.scrollWidth,
height: document.body.scrollHeight
}
} else {
return {
width: document.documentElement.scrollWidth,
height: document.documentElement.scrollHeight
}
}
}
/**
* 获取元素的在文档中的定位
* author: kaier
* time:2020-11-3
*/
window.getElemDocPos = function(elem) {
var left = elem.offsetLeft,
top = elem.offsetTop,
parent = elem.offsetParent;
while(parent){
left += parent.offsetLeft;
top += parent.offsetTop;
elem = parent;
parent = parent.offsetParent;
}
return {
left: left,
top: top
}
}
/***
* 给元素绑定事件
* author: kaier
* time: 2020-11-3
* return 函数引用，用于解除事件
*/
window.addEvent = function(el,type,fn){
if(el.addEventListener){
el.addEventListener(type,fn,false);
}else if(el.attachEvent){
function test(){
fn.call(el);
}
el.attachEvent("on" + type ,test);
return test;
}else {
el["on"+type] = fn;
}
return fn;
}
/***
* 给元素解除绑定事件
* author: kaier
* time: 2020-11-3
*/
window.removeEvent = function(el,type,fn){
if(el.removeEventListener){
el.removeEventListener(type,fn);
}else if(el.detachEvent){
el.detachEvent("on"+type,fn);
}else{
el["on"+type] = null;
}
}
/***
* discribe: 阻止冒泡
* auther: kaier
* time: 2020-11-3
*/
window.stopBubble = function(e){
var e = e || window.event;
if(e.stopPropagation){
e.stopPropagation();
}else{
e.cancelBubble = true;
}
}
/***
* discribe: 阻止默认行为
* auther: kaier
* time: 2020-11-3
*/
window.stopDefauleActive = function(e){
var e = e || window.event;
if(e.preventDefault){
e.preventDefault();
}else{
e.returnValue = false;
}
}
/**
* 获取事件发生时鼠标的位置
* author: kaier
* time: 2020-11-3
*/
window.getDocPos = function(e){
var e = e || window.event,
sPosMsg = getScrollOffset(),
docOffsetLeft = document.documentElement.clientLeft || 0,
docOffsetTop = document.documentElement.clientTop || 0;
return {
x:sPosMsg.left + e.clientX - docOffsetLeft,
y:sPosMsg.top + e.clientY - docOffsetTop
}
}
/**
* 重写forEach方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myForEach = function(fn){
for(var i = 0 , len = this.length ; i < len ; i++ ){
fn(this[i],i,this);
}
}
/**
* 重写filter方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myFilter = function(fn){
var result = [] ,
item;
for(var i = 0 , len = this.length ; i < len ; i++ ){
item = this[i];
if(fn(this[i],i,this)){
result.push(this[i]);
}
}
return result;
}
/**
* 重写map方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myMap = function(fn){
var result = [] ;
for(var i = 0 , len = this.length; i < len ; i++){
result.push(fn(this[i],i,this));
}
return result;
}
/**
* 重写reduce方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myReduce = function(fn,value){
var i = 0 ,
len = this.length;
if(value === undefined){
value = this[i];
i++;
}
for( ; i < len ; i++){
value = fn(value,this[i],i,this);
}
return value;
}
/**
* 重写reduceRight方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myReduceRight = function(fn,value){
var i = this.length - 1;
if(value === undefined){
value = this[i];
i--;
}
for( ; i >= 0 ; i--){
value = fn(value,this[i],i,this);
}
return value;
}
/**
* 重写every方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.myEvery = function(fn){
for(var i = 0 , len = this.length ; i < len ; i++){
if(!fn(this[i],i,this)){
return false;
}
}
return true;
}
/**
* 重写some方法
* author: kaier
* time: 2020年11月05日
*/
Array.prototype.mySome = function(fn){
for(var i = 0 , len = this.length ; i < len ; i++){
if(fn(this[i],i,this)){
return true;
}
}
return false;
}
/**
* 重写lastIndexOf方法
* author: kaier
* time: 2020年11月09日
*/
Array.prototype.myLastIndexOf = function(value){
for(var i = this.length -1 ; i >=0 ; i--){
if(this[i] === value){
return i;
}
}
}
/**
* 重写indexOf方法
* author: kaier
* time: 2020年11月09日
*/
Array.prototype.myIndexOf = function(value){
for(var i = 0 , len = this.length ; i < len ; i++){
if(this[i] === value){
return i;
}
}
}
/**
* 重写bind方法
* author: kaier
* time: 2020年11月05日
*/
Function.prototype.myBind = function(){
var argu = arguments,
_self = this;
return function(){
//我是重写的方法
var params = [];
for(var i = 1 ,len = argu.length ; i < len ; i++){
params.push(argu[i]);
}
params = params.concat(Array.prototype.slice.call(arguments));
return _self.apply(argu[0],params);
}
}
/**
* 深拷贝（包括函数）
* author: kaier
* time: 2020年11月07日
*/
window.deepClone = function (obj){
var ops = Object.prototype.toString,
type = ops.call(obj);
if(obj === null){
return null;
}
if(type === "[object Array]"){
var resArr = [];
for(var i = obj.length-1 ; i >= 0 ; i--){
var typeItem = ops.call(obj[i]);
if(typeItem === "[object Array]" ||
typeItem === "[object Object]" ||
typeItem === "[object Function]"){
resArr.unshift(deepClone(obj[i]));
}else{
resArr.unshift(obj[i]);
}
}
return resArr;
}
if(type === "[object Object]"){
var resObj = {};
for(var key in obj){
if(obj.hasOwnProperty(key)){
var typeItem = ops.call(obj[key]);
if(typeItem === "[object Array]" ||
typeItem === "[object Object]" ||
typeItem === "[object Function]"){
resObj[key] = deepClone(obj[key]);
}else{
resObj[key] = obj[key];
}
}
}
return resObj;
}
if(type === "[object Function]"){
var resfun = obj.toString(),
funRegExp = /(?<=\{)[\s\S]*(?=\}$)/g;
return new Function(resfun.match(funRegExp)[0]);
}
return obj;
}
/**
* 把函数转为JSON
* author: kaier
* time: 2020年11月07日
*/
JSON.myStringify = function (obj){
var myobj = window.deepClone(obj),
ops = Object.prototype.toString;
for(var key in myobj){
if(ops.call(myobj[key]) === "[object Function]"){
myobj[key] = myobj[key].toString();
}
}
return JSON.stringify(myobj);
}
/**
* 返回重复字符串的次数
* @param {数字} num
* @author {kaier}
* @time 2020-11-11
*/
String.prototype.myRepeat = function(num){
var result = this;
for(var i = 0 ; i < num - 1 ; i++) {
result+=this;
}
return result;
}
/**
* 重写startsWith
* @param {匹配字符} str
* @param {索引} pos
* @author {kaier}
* @time 2020-11-11
*/
String.prototype.myStartsWith = function(str,pos){
var regexp = new RegExp("^"+str),
testStr;
pos || (pos = 0);
if(pos >= this.length || pos < 0){
return false;
}
testStr = this.slice(pos);
return regexp.test(testStr);
}
/**
* 重写endsWith
* @param {匹配字符} str
* @param {索引} pos
* @author {kaier}
* @time 2020-11-11
*/
String.prototype.myEndsWith = function(str,pos){
var regexp = new RegExp(str+"$"),
testStr;
pos || (pos = this.length);
if(pos > this.length || pos < 0){
return false;
}
testStr = this.slice(0,pos);
return regexp.test(testStr);
}
/**
* 重写includes
* @param {匹配字符} str
* @param {索引} pos
* @author {kaier}
* @time 2020-11-11
*/
String.prototype.myIncludes = function(str,pos){
var regexp = new RegExp(str),
testStr;
pos || (pos = 0);
if(pos >= this.length || pos < 0){
return false;
}
testStr = this.slice(pos);
return regexp.test(testStr);
}
})(window);
标签：11,function,兼容性,return,函数,javascript,window,2020,var 来源： https://blog.csdn.net/qq_41475982/article/details/112058439
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。