jquery在IE、FF浏览器的差别详细探讨


Posted in Javascript onApril 28, 2013

1.今天突然想到了jquery好处时间没有用到了,就练习了一下,谁知道,就碰到了jquery在IE,FF浏览器差别的问题了,好了废话也不多说了,就将一下碰到的问题吧
2.大部分使用过jquery的都知道,在FF上面浏览的效果是刚刚的,但是这些刚刚的效果,在IE上面运用的效果差强人意的。
3.今天练习的一个效果是这样的
jquery在IE、FF浏览器的差别详细探讨
就是点击个个颜色,然后使得页面的背景颜色变成同样的颜色
4.上图中的效果使用简单的代码就可以完成了,而且在IE,FF中的效果是同样的,这里就只贴出jquery中的代码了,非常的简单的

<script type="text/javascript"> 
$(document).ready(function(){ 
$("div span").each(function(){ 
$("div span").click(function(){ 
var index = $("div span").index(this); 
$("#css").attr("href","css/index"+index+".css");这个css是<link rel="stylesheet" type="text/css" href="css/index.css" id="css">中的,这行代码是HTML中的,相信大家都懂得 
if(index==7){ 
$("#css").attr("href","css/index.css"); 
} 
}); 
}); 
}); 
</script>

下面是HTML中的代码
<div align="right" id="div"> 
<span class="myBox"> 
      
</span> 
<span class="myBox1"> 
      
</span> 
<span class="myBox2"> 
      
</span> 
<span class="myBox3"> 
      
</span> 
<span class="myBox4"> 
      
</span> 
<span class="myBox5"> 
      
</span> 
<span class="myBox6"> 
      
</span> 
<span class="myBox7">还原</span>

下面的css样式就不贴出来了啊,相信大家都晓得的
下面就说一下另外的一个差别的代码,从而使我了解到了IE,FF对于jquery的使用
jquery在IE、FF浏览器的差别详细探讨 
1.
看到这个图片和上面的图片的区别,相信大家很容易就查出来,对的,这个的一个小图标的四个角都是弧度的,为了完成这个弧度的,我使用了一个js,这个js是这个“jquery.curvycorners.source.js”通过方法
$(document).ready(function(){ 
settings = { 
tl: { radius: 10 }, 
tr: { radius: 10 }, 
bl: { radius: 10 }, 
br: { radius: 10 }, 
antiAlias: true, 
autoPad: true, 
validTags: ["span"] 
} 
$('.myBox').corner(settings); 
$('.myBox1').corner(settings); 
$('.myBox2').corner(settings); 
$('.myBox3').corner(settings); 
$('.myBox4').corner(settings); 
$('.myBox5').corner(settings); 
$('.myBox6').corner(settings); 
$('.myBox7').corner(settings); 
});

这个方法来使上面的图片的四个角变成弧度的,但是问题出来了
这个方法,这个js在FF运行的效果非常完成,但是出现在IE上面则没有效果的
之前没有注意过,但今天进行测试后,有点小的意见,是不是对于一些自定义的js,IE的兼容性不是太好呢,之前做过一个项目,也是自定义了一个js,然后通过Script来嵌套到页面中,在FF的效果很好,但是在IE上面没有效果,当时也没有在意,通过今天的练习发现,“是不是对于一些自定义的js,IE的兼容性不是太好呢?”是真的呢?要不要以后尽量少的自定义js,但是如果不自定义js,那么页面中的 代码就会很多的啊?有点迷茫ING...
Javascript 相关文章推荐
js 发个判断字符串是否为符合标准的函数
Apr 27 Javascript
javascript中onclick(this)用法介绍
Apr 19 Javascript
ExtJS中设置下拉列表框不可编辑的方法
May 07 Javascript
基于jQuery实现的QQ表情插件
Aug 25 Javascript
jQuery在ie6下无法设置select选中的解决方法详解
Sep 20 Javascript
JavaScript 动态三角函数实例详解
Jan 08 Javascript
webpack中使用iconfont字体图标的方法
Feb 22 Javascript
Vue 打包体积优化方案小结
May 20 Javascript
vue 实现setInterval 创建和销毁实例
Jul 21 Javascript
详解三种方式在React中解决绑定this的作用域问题并传参
Aug 18 Javascript
原生JS实现京东查看商品点击放大
Dec 21 Javascript
使用vue判断当前环境是安卓还是IOS
Apr 12 Vue.js
js自动下载文件到本地的实现代码
Apr 28 #Javascript
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
Apr 27 #Javascript
jQuery语法高亮插件支持各种程序源代码语法着色加亮
Apr 27 #Javascript
JQuery onload、ready概念介绍及使用方法
Apr 27 #Javascript
用jquery实现输入框获取焦点消失文字
Apr 27 #Javascript
javascript中强制执行toString()具体实现
Apr 27 #Javascript
用客户端js实现带省略号的分页
Apr 27 #Javascript
You might like
一篇不错的PHP基础学习笔记
2007/03/18 PHP
php实现异步数据调用的方法
2015/12/24 PHP
golang 调用 php7详解及实例
2017/01/04 PHP
php分享朋友圈的实现代码
2019/02/18 PHP
Thinkphp5框架实现图片、音频和视频文件的上传功能详解
2019/08/27 PHP
理解Javascript_03_javascript全局观
2010/10/11 Javascript
fancybox modal的完美解决(右上的X)
2012/10/30 Javascript
document.createElement()用法及注意事项(ff下不兼容)
2013/03/13 Javascript
利用webqq协议使用python登录qq发消息源码参考
2013/04/08 Javascript
jQuery中before()方法用法实例
2014/12/25 Javascript
BootStrap selectpicker
2016/06/20 Javascript
精彩的Bootstrap案例分享 重点在注释!(选项卡、栅格布局)
2016/07/01 Javascript
js实现文字跑马灯效果
2017/02/23 Javascript
BootStrap注意事项小结(五)表单
2017/03/10 Javascript
深入浅析AngularJs模版与v-bind
2018/07/06 Javascript
JSON stringify方法原理及实例解析
2020/10/23 Javascript
[50:50]完美世界DOTA2联赛PWL S3 Galaxy Racer vs Phoenix 第一场 12.10
2020/12/13 DOTA
python分割和拼接字符串
2013/11/01 Python
python实现抖音视频批量下载
2018/06/20 Python
python 矢量数据转栅格数据代码实例
2019/09/30 Python
三个python爬虫项目实例代码
2019/12/28 Python
python Plotly绘图工具的简单使用
2020/03/03 Python
python+adb+monkey实现Rom稳定性测试详解
2020/04/23 Python
Python爬虫headers处理及网络超时问题解决方案
2020/06/19 Python
Python下划线5种含义代码实例解析
2020/07/10 Python
python,Java,JavaScript实现indexOf
2020/09/09 Python
python中_del_还原数据的方法
2020/12/09 Python
解决pytorch 的state_dict()拷贝问题
2021/03/03 Python
简单整理HTML5的基本特性和语法
2016/02/18 HTML / CSS
加拿大便宜的隐形眼镜商店:Clearly
2016/09/15 全球购物
DC Shoes荷兰官方网站:美国极限运动品牌
2019/10/22 全球购物
介绍一下SQL Server的全文索引
2013/08/15 面试题
监督检查工作方案
2014/05/28 职场文书
学校财务管理制度
2015/08/04 职场文书
幼儿园教师心得体会范文
2016/01/21 职场文书
Golang流模式之grpc的四种数据流
2022/04/13 Golang