JS中兼容问题的汇总
获取非行内样式的兼容方式
- function getStyle(obj,attr){ //获取非行间样式,obj是对象,attr是值
- if(obj.currentStyle){ //针对ie获取非行间样式
- return obj.currentStyle[attr];
- }else{
- return getComputedStyle(obj,false)[attr]; //针对非ie
- }
- }
获取事件对象的兼容方式
- document.onclick=function(eve){
- var e=eve||window.event;
- console.log(e);
- }
事件冒泡的兼容方法
- function stopBubble(e){
- if(e.stopPropagation){
- e.stopPropagation();
- }else{
- e.cancelBubble = true;//兼容ie
- }
- }
阻止浏览器默认行为的兼容方法
- if( e.preventDefault ){
- e.preventDefault();
- }else{
- window.event.returnValue = false;//ie
- }
监听事件的设置和移除的兼容方式
- .封装成对象的方式
- var EventUtil={
- addHandler:function(DOM,EventType,fn){
- if(DOM.addEventListener){
- DOM.addEventListener(EventType,fn,false);
- }else if(DOM.attachEvent){
- DOM.attachEvent('on'+EventType,fn)
- }else{
- DOM['on'+EventType]=fn
- }
- },
- removeHandler:function(DOM,EventType,fn){
- if(DOM.removeEventListener){
- DOM.removeEventListener(EventType,fn,false)
- }else if(DOM.detachEvent){
- DOM.detachEvent('on'+EventType,fn)
- }else{
- DOM['on'+EventType]=null;
- }
- }
- }
- .封装成两个函数的方式
- function addEvent(obj,inci,back){
- if(obj.addEventListener){
- obj.addEventListener(inci,back);
- }else if(obj.attachEvent){
- obj.attachEvent("on" + inci,back);
- }else{
- obj["on"+inci] = back;
- }
- }
- function removeEvent(obj,inci,back){
- if(obj.removeEventListener){
- obj.removeEventListener(inci,back,false);
- }else if(obj.detachEvent){
- obj.detachEvent("on" + inci,back);
- }else{
- obj["on"+inci] = null;
- }
- }
事件委托的兼容方法
- var oul = document.querySelector("ul")
- oul.onclick = function(eve){
- var e = eve || window.event;
- var t = e.target || e.srcElement;
- if(t.getAttribute("abc") == "l"){
- console.log(e.target.innerHTML)
- }
- }
键盘事件的兼容方法
- var eve = eve||window.event;
- var keyC = eve.keyCode||eve.which;
以上是本人在学习js过程中遇见的几个兼容方式的汇总,如果哪里有错误希望大家指出,谢谢。
JS中兼容问题的汇总的更多相关文章
- js中的DOM操作汇总
一.DOM创建 DOM节点(Node)通常对应于一个标签,一个文本,或者一个HTML属性.DOM节点有一个nodeType属性用来表示当前元素的类型,它是一个整数: Element,元素 Attrib ...
- js中typeof的用法汇总[转载]
http://www.jb51.net/article/43187.htm JavaScript中的typeof其实非常复杂,它可以用来做很多事情,但同时也有很多怪异的表现.本文列举出了它的多个用法, ...
- js中typeof的用法汇总
- JS中常遇到的浏览器兼容问题和解决方法
今天整理了一下浏览器对JS的兼容问题,希望能给你们带来帮助,我没想到的地方请留言给我,我再加上: 常遇到的关于浏览器的宽高问题: //以下均可console.log()实验 var winW=docu ...
- js中getBoundingClientRect的作用及兼容方案
js中getBoundingClientRect的作用及兼容方案 1.getBoundingClientRect的作用 getBoundingClientRect用于获取某个html元素相对于视窗的位 ...
- JS中常遇到的浏览器兼容问题和解决方法【转】
今天整理了一下浏览器对JS的兼容问题,希望能给你们带来帮助,我没想到的地方请留言给我,我再加上: 常遇到的关于浏览器的宽高问题: //以下均可console.log()实验 var winW=docu ...
- 分享一个自定义的 console 类,让你不再纠结JS中的调试代码的兼容
问题的产生 在写JS的过程中,为了调试我们常常会写很多 console.log.console.info.console.group.console.warn.console.error代码来查看JS ...
- js中对arry数组的各种操作小结 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据 web前端url传递值 js加密解密 HTML中让表单input等文本框为只读不可编辑的方法 js监听用户的键盘敲击事件,兼容各大主流浏览器 HTML特殊字符
js中对arry数组的各种操作小结 最近工作比较轻松,于是就花时间从头到尾的对js进行了详细的学习和复习,在看书的过程中,发现自己平时在做项目的过程中有很多地方想得不过全面,写的不够合理,所以说啊 ...
- js中的总结汇总(以后的都收集到这篇)
点1:js中的比较字符串是否相等,js中是用"=="这个来判断是否相等,这点跟java中不一样,java中是.equals()这种方法. 在之前写的ajax的demo中,因为用了. ...
随机推荐
- LTM_本地流量管理(一)
基本元素及概念 Node:节点,即服务器的IP地址. Member:成员,即一个服务,用IP+端口表示. Pool:池:一个或多个Member的逻辑分组,一个Pool表示一个应用,每个Pool都有自己 ...
- Quick BI的SQL传参建模可以用在什么场景
Quick B的SQL传参建模功能提供基于SQL的数据加工处理能力,减轻了IT支撑人员的工作量.在即席查询SQL中,我们用物理字段显示别名来表示参数的占位符,配置完占位符后,就可以在查询控件中进行参数 ...
- PHP基础教程 常见PHP错误类型及屏蔽方法
程序只要在运行,就免不了会出现错误,错误很常见,比如Error,Notice,Warning等等.这篇文章兄弟连PHP培训 小编来跟大家具体说一下PHP的错误类型和屏蔽方法.在 PHP 中,主要有以下 ...
- POJ 3764 The xor-longest Path ( 字典树求异或最值 && 异或自反性质 && 好题好思想)
题意 : 给出一颗无向边构成的树,每一条边都有一个边权,叫你选出一条路,使得此路所有的边的异或值最大. 分析 : 暴力是不可能暴力的,这辈子不可能暴力,那么来冷静分析一下如何去做.假设现在答案的异或值 ...
- Java——容器(Comparable)
[Comparable]
- 上传文件报413 Request Entity Too Large错误解决办法
产生这种原因是因为服务器限制了上传大小 1.nginx服务器的解决办法 修改nginx.conf的值就可以解决了 将以下代码粘贴到nginx.conf内 client_max_body_size 20 ...
- [BZOJ3236]:[Ahoi2013]作业(莫队+分块)
题目传送门 题目描述 此时已是凌晨两点,刚刚做了$Codeforces$的小$A$掏出了英语试卷.英语作业其实不算多,一个小时刚好可以做完.然后是一个小时可与做完的数学作业,接下来是分别都是一个小时可 ...
- 转:KVM使用NAT联网并为VM配置iptables端口转发,kvmiptables
转载地址:https://www.ilanni.com/?p=7016 在前面的文章中,我们介绍KVM的虚拟机(以下简称VM)都是通过桥接方式进行联网的. 本篇文章我们来介绍KVM的VM通过NAT方式 ...
- 【后台管理系统】—— Ant Design Pro组件使用(二)
一.关联表单项 - 动态增删输入框Input 封装子组件 class ParamsInputArray extends React.Component{ constructor(prop ...
- React Native商城项目实战10 - 个人中心中间内容设置
1.新建一个MineMiddleView.js,专门用于构建中间的内容 /** * 个人中心中间内容设置 */ import React, { Component } from 'react'; im ...