作者：梨依籽_852 | 来源：互联网 | 2023-09-24 20:25
兼容性问题：函数（方法）兼容描述：部分W3C指定的函数，有部分老的浏览器不支持解决：条件判断，如果有，则使用，添加原型方法，例如String的trim方法if(!Stri
兼容性问题：函数（方法）兼容
描述：部分W3C指定的函数，有部分老的浏览器不支持
解决：
条件判断，如果有，则使用，添加原型方法，例如 String 的 trim 方法
if(!String.prototype.trim){
String.prototype.trim = function(){
return this.replace(/^\s\s*/,'').replace(/\s\s*$/,'')
}
}
兼容性问题：浏览器视口、屏幕、页面宽高获取
解决：
1. 获得当前页面 HTML文档所在窗口 宽度
//所有浏览器都支持这种写法，不存在兼容性问题
var w = document.body.clientWidth
var h = document.body.clientHeight
2. 获得浏 览器窗口内部 宽度 / 高度 ，比 HTML文档所在窗口宽度 多 16px
// document.documentElement.clientWidth IE浏览器写法
// window.innerWidth 其他浏览器写法
var w = document.documentElement.clientWidth || window.innerWidth
var h = document.documentElement.clientHeight || window.innerHeight
3.获得 HTML页面内容 宽度 / 高度 （文档实际高度）
//没有兼容性问题
var h = document.body.scrollHeight
var h = document.body.scrollWidth
4. 获得当前页面 被卷去的高度 / 宽度
//window.pageYOffset 其他浏览器写法
//document.documentElement.scrollTop IE浏览器写法
var offsetY = window.pageYOffset || document.documentElement.scrollTop
兼容性问题：事件
获取事件
document.Onclick=function(ev){//谷歌火狐的写法，IE9以上支持，往下不支持；
var e=ev;
console.log(e);
}
document.onclick=function(){//谷歌和IE支持，火狐不支持；
var e=event;
console.log(e);
}
document.onclick=function(ev){//兼容写法；
var e=ev||window.event;
var mouseX=e.clientX;//鼠标X轴的坐标
var mouseY=e.clientY;//鼠标Y轴的坐标
}
京公网安备 11010802041100号