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 相关文章推荐
javascript中获取选中对象的类型
Apr 02 Javascript
input的focus方法使用
Mar 13 Javascript
基于jquery的blockui插件显示弹出层
Apr 14 Javascript
Javascript继承机制的设计思想分享
Aug 28 Javascript
利用JS判断用户是否上网(连接网络)
Dec 23 Javascript
jquery插件corner实现圆角边框的方法
Mar 09 Javascript
js强制把网址设为默认首页
Sep 29 Javascript
vue实现点击展开点击收起效果
Apr 27 Javascript
Taro集成Redux快速上手的方法示例
Jun 21 Javascript
ES6的解构赋值实例详解
May 06 Javascript
js Proxy的原理详解
May 25 Javascript
vue+elementui 实现新增和修改共用一个弹框的完整代码
Jun 08 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执行定时任务的实现思路
2015/12/21 PHP
浅谈ThinkPHP5.0版本和ThinkPHP3.2版本的区别
2017/06/17 PHP
Thinkphp框架+Layui实现图片/文件上传功能分析
2020/02/07 PHP
JavaScript 实现??打印?理
2007/04/28 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
2012/04/12 Javascript
jquery弹出关闭遮罩层实例
2013/08/06 Javascript
jQuery自动切换/点击切换选项卡效果的小例子
2013/08/12 Javascript
jQuery如何获取同一个类标签的所有值(默认无法获取)
2014/09/25 Javascript
jQuery老黄历完整实现方法
2015/01/16 Javascript
使用Angular和Nodejs、socket.io搭建聊天室及多人聊天室
2015/08/21 NodeJs
JavaScript实现标题栏文字轮播效果代码
2015/10/24 Javascript
Bootstrap CSS组件之按钮下拉菜单
2016/12/17 Javascript
react.js使用webpack搭配环境的入门教程
2017/08/14 Javascript
基于Vue的SPA动态修改页面title的方法(推荐)
2018/01/02 Javascript
Vue slot用法(小结)
2018/10/22 Javascript
VUE页面中通过双击实现复制表格中内容的示例代码
2020/06/11 Javascript
[03:24]DOTA2超级联赛专访hao 大翻盘就是逆袭
2013/05/24 DOTA
Python获取指定字符前面的所有字符方法
2018/05/02 Python
查看django版本的方法分享
2018/05/14 Python
十分钟搞定pandas(入门教程)
2019/06/21 Python
python实现自动化上线脚本的示例
2019/07/01 Python
pandas计算最大连续间隔的方法
2019/07/04 Python
详解pandas中MultiIndex和对象实际索引不一致问题
2019/07/23 Python
python爬虫爬取某网站视频的示例代码
2021/02/20 Python
澳大利亚领先的宠物用品商店:VetSupply
2017/09/08 全球购物
北京鼎普科技股份有限公司软件测试面试题
2012/04/07 面试题
酒店值班经理的工作职责范本
2014/02/18 职场文书
地球一小时宣传标语
2014/06/24 职场文书
法英专业大学生职业生涯规划书范文
2014/09/22 职场文书
领导班子个人对照检查剖析材料
2014/09/29 职场文书
毕业生班级鉴定评语
2015/01/04 职场文书
公司搬迁通知
2015/04/20 职场文书
奶茶店的创业计划书该怎么写?
2019/07/15 职场文书
nginx处理http请求实现过程解析
2021/03/31 Servers
如何使用Python实现一个简易的ORM模型
2021/05/12 Python
NodeJs使用webpack打包项目的方法详解
2022/02/28 NodeJs