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 相关文章推荐
动态创建样式表在各浏览器中的差异测试代码
Sep 13 Javascript
基于datagrid框架的查询
Apr 08 Javascript
JSON无限折叠菜单编写实例
Dec 16 Javascript
jQuery链式操作实例分析
Nov 16 Javascript
详解AngularJs中$sce与$sceDelegate上下文转义服务
Sep 21 Javascript
JS打开摄像头并截图上传示例
Feb 18 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 Javascript
Web开发中客户端的跳转与服务器端的跳转的区别
Mar 05 Javascript
浅谈js中的this问题
Aug 31 Javascript
详解webpack babel的配置
Jan 09 Javascript
Vuex持久化插件(vuex-persistedstate)解决刷新数据消失的问题
Apr 16 Javascript
vue-router 前端路由之路由传值的方式详解
Apr 30 Javascript
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和Mysqlweb应用开发核心技术 第1部分 Php基础-3 代码组织和重用2
2011/07/03 PHP
JSON在PHP中的应用介绍
2012/09/08 PHP
php图片添加水印例子
2016/07/20 PHP
利用laravel搭建一个迷你博客实战教程
2017/08/13 PHP
初学JavaScript第二章
2008/09/30 Javascript
javascript转换字符串为dom对象(字符串动态创建dom)
2010/05/10 Javascript
腾讯的ip接口 方便获取当前用户的ip地理位置
2010/11/25 Javascript
jQuery LigerUI 使用教程入门篇
2012/01/18 Javascript
jquery插件开发注意事项小结
2013/06/04 Javascript
探讨js字符串数组拼接的性能问题
2014/10/11 Javascript
jQuery基础知识点总结(DOM操作)
2016/06/01 Javascript
全面解析DOM操作和jQuery实现选项移动操作代码分享
2016/06/07 Javascript
原生js检测页面加载完毕的实例
2018/09/11 Javascript
JavaScript ES6箭头函数使用指南
2018/12/30 Javascript
Ant Design的可编辑Tree的实现操作
2020/10/31 Javascript
ES6 十大特性简介
2020/12/09 Javascript
[55:44]完美世界DOTA2联赛决赛 FTD vs Phoenix 第二场 11.08
2020/11/11 DOTA
在Python中操作时间之mktime()方法的使用教程
2015/05/22 Python
Python引用模块和查找模块路径
2016/03/17 Python
基于Python的关键字监控及告警
2017/07/06 Python
python做量化投资系列之比特币初始配置
2018/01/23 Python
Python实现的维尼吉亚密码算法示例
2018/04/12 Python
win10系统下Anaconda3安装配置方法图文教程
2018/09/19 Python
Python3+Pycharm+PyQt5环境搭建步骤图文详解
2019/05/29 Python
Anaconda的安装及其环境变量的配置详解
2020/04/22 Python
HTML高亮关键字的实现代码
2018/10/22 HTML / CSS
教育学专业毕业生的自我鉴定
2013/11/26 职场文书
自荐书范文范例
2014/02/13 职场文书
会计岗位描述
2014/02/22 职场文书
授权委托书(完整版)
2014/09/10 职场文书
2014年转正工作总结
2014/11/08 职场文书
办公用品管理制度
2015/08/04 职场文书
幼儿园安全管理制度
2015/08/05 职场文书
Spring Boot项目传参校验的最佳实践指南
2022/04/05 Java/Android
Go并发4种方法简明讲解
2022/04/06 Golang
总结三种用 Python 作为小程序后端的方式
2022/05/02 Python