- 浏览: 1154525 次
- 性别:
- 来自: 上海
文章分类
- 全部博客 (411)
- ASP (6)
- ASP.NET (2)
- CSS (4)
- HTML (11)
- Javascript (34)
- Java (100)
- PHP (1)
- XML (2)
- Flash/Flex/AS (1)
- 编程理论 (6)
- 操作系统 (23)
- 架构与搭建 (13)
- 软件应用 (39)
- 移动开发及应用 (4)
- UI设计 (2)
- 数据库 (23)
- 围棋 (1)
- 闲语茶楼 (6)
- 金融 (1)
- 其他 (3)
- Linux/Unix (38)
- 项目管理 (3)
- cmd (2)
- ssh (3)
- SVN (1)
- 移动开发 (1)
- HTML5 (1)
- jquery (1)
- redis (1)
- nginx (2)
- webservice (1)
- vmware (1)
- ssl (1)
- eclipse (1)
- sqlite (1)
- spring (2)
最新评论
-
cnhome:
Java 8 下:// 编码String asB64 = Ba ...
不要使用sun.misc.BASE64Encoder -
请叫我翠西狗:
那如果我要用this.getServletContext() ...
JSP/Servlet使用代理或路由器映射时获取服务器地址为内网地址 -
nomblouder:
按照别的博客,别名一直是p4merge,导致一直报错comma ...
win与linux下git配置p4merge为合并比较工具的方法 -
linuxzhang:
请问我按你的方法修改了sts-3.7.3.RELEASE中的o ...
Eclipse中setter/getter方法自动添加属性注释 -
yzh__:
求解答。。。
Struts2定义默认拦截器时需要注意
应该采用:
document.getElementById(”apple”) 以ID来访问对象,且一个ID在页面中必须是唯一的
document.getElementsByTagName(”div”)[0] 以标签名来访问对象
1.setAttribute(string name, string value):增加一个指定名称和值的新属性,或者把一个现有的属性设定为指定的值。
设置对象的属性则应该采用:
document.getElementById(”apple”).setAttribute(”width”,"100″)
document.getElementsByTagName(”div”)[0].setAttribute(”width”,"100″)
访问对象的属性则采用:
document.getElementById(”apple”).getAttribute(”width”)
document.getElementsByTagName(”div”)[0].getAttribute(”width”)
我们经常需要在JavaScript中给Element动态添加各种属性,这可以通过使用setAttribute()来实现,这就涉及到了浏览器的兼容性问题。
var bar = document.getElementById(”foo”);
bar.setAttribute(”onclick”, "javascript:alert(’This is a test!’);");
这里利用setAttribute指定e的onclick属性,简单,很好理解。但是IE不支持,IE并不是不支持setAttribute这个函数,
而是不支持用setAttribute设置某些属性,例如对象属性、集合属性、事件属性,也就是说用setAttribute设置style和onclick这些属性
在IE中是行不通的。为达到兼容各种浏览器的效果,可以用点符号法来设置Element的对象属性、集合属性和事件属性。
document.getElementById(”foo”).className = “fruit”;
document.getElementById(”foo”).style.cssText = “color: #00f;”;
document.getElementById(”foo”).style.color = “#00f”;
document.getElementById(”foo”).onclick= function () { alert(”This is a test!”); }
2、关于class和className
class属性在W3C DOM中扮演着很重要的角色,但由于浏览器差异性仍然存在。使用setAttribute(”class”, vName)语句动态设置
Element的class属性在firefox中是行的通的,在IE中却不行。因为使用IE内核的浏览器不认识”class”,要改用”className”;
同样,firefox 也不认识"className”。所以常用的方法是二者兼备:
element.setAttribute(”class”, vName);
element.setAttribute(”className”, vName); //for IE
关于IE下TABLE无法插入新行的问题
IE下TABLE无论是用innerHTML还是appendChild插入<tr>都没有效果,而其他浏览器却显示正常。解决他的方法是,将<tr>加到TABLE的<tbody>元素中,如下面所示:
var row = document.createElement(”tr”);
var cell = document.createElement(”td”);
var cell_text = document.createTextNode(”香蕉不吃苹果");
cell.appendChild(cell_text);
row.appendChild(cell);
document.getElementsByTagName(”tbody”)[0].appendChild(row);
window.event
IE:有window.event对象
FF:没有window.event对象。可以通过给函数的参数传递event对象。如onmousemove=doMouseMove(event)
鼠标当前坐标
IE:event.x和event.y。
FF:event.pageX和event.pageY。
通用:两者都有event.clientX和event.clientY属性。
鼠标当前坐标(加上滚动条滚过的距离)
IE:event.offsetX和event.offsetY。
FF:event.layerX和event.layerY。
标签的x和y的坐标位置:style.posLeft 和 style.posTop
IE:有。
FF:没有。
通用:object.offsetLeft 和 object.offsetTop。
窗体的高度和宽度
IE:document.body.offsetWidth和document.body.offsetHeight。注意:此时页面一定要有body标签。
FF:window.innerWidth和window.innerHegiht,以及document.documentElement.clientWidth和document.documentElement.clientHeight。
通用:document.body.clientWidth和document.body.clientHeight。
添加事件
IE:element.attachEvent(”onclick”, func);。
FF:element.addEventListener(”click”, func, true)。
通 用:element.onclick=func。虽然都可以使用onclick事件,但是onclick和上面两种方法的效果是不一样的, onclick只有执行一个过程,而attachEvent和addEventListener执行的是一个过程列表,也就是多个过程。例如: element.attachEvent(”onclick”, func1);element.attachEvent(”onclick”, func2)这样func1和func2都会被执行。
标签的自定义属性
IE:如果给标签div1定义了一个属性value,可以div1.value和div1["value"]取得该值。
FF:不能用div1.value和div1["value"]取。
通用:div1.getAttribute(”value”)。
父节点、子节点和删除节点
IE:parentElement、parement.children,element.romoveNode(true)。
FF:parentNode、parentNode.childNodes,node.parentNode.removeChild(node)。
CSS:透明
IE:filter:progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=60)。
FF:opacity:0.6。
设置CSS 的STYLE
document.getElementById(’look’).style.cssText=”display:none;”;//通用
document.getElementById(’look’).setAttribute(”style”,"display:none;”);//firefox
发表评论
-
jQuery 1.9升级指南(中文翻译版)【转】
2014-02-07 13:49 1052jQuery 1.9删除或修改了几个过去行为不一致或效率低 ... -
Java现实WebSocket
2013-11-15 09:59 1998无所不能的Java系列文章,涵盖了Java的思想,应用开发, ... -
CKFinder2.1的破解方法
2012-02-07 11:30 3862打开ckfinder.js文件 一、 找到 ... -
IE下无法跨域跳转的问题
2012-01-04 10:25 3121这两天为了实现项目中的子平台session共享的问题,几乎费劲 ... -
各按键对应keycode一览表
2011-08-24 14:29 1452keycode 8 = BackSpace Ba ... -
CKEditer的销毁
2011-07-27 11:39 2138由于业务需求,在一分表单中对同一个textarea需要根据下拉 ... -
DWR的注释(annotations)使用及反向调用(Reverse Ajax)
2011-04-21 10:09 1465先说说注释语法,省掉dwr.xml。(自从用了java 5 之 ... -
玩转FusionCharts:Div层被Flash遮住
2011-02-18 15:02 1869在应用FusionCharts的过程中,可能会出现页面的Div ... -
jQuery锚点跳转滚动条平滑滚动
2010-11-25 00:12 2461$("html,body").animat ... -
Javascript Print(*)
2010-09-28 15:10 14641. 实现打印功能1) ExecW ... -
在网页中控制PDF打印的方法
2010-09-08 16:18 6732Adobe Reader: 注:以下内容需要本地安装过Ado ... -
Web框架——DWR中signatures标签的使用
2010-09-02 12:18 2086signatures段使DWR能确定集合中存放的数据类型。例如 ... -
Javascript压缩工具
2010-08-05 13:42 1011javascriptcompressor.com (在线压 ... -
用javascript设置iframe的onload事件的回调方法(兼容ie及firefox)
2010-06-04 15:10 2341function eventPush(obj, event, ... -
如何控制获得form表单弹出新窗口
2009-11-13 11:47 7290先用 window.open 打开一个你期望样式的窗口,然后将 ... -
javascript中parseInt的问题
2009-08-11 11:56 1246今天遇到一个有趣的问题,就是在用javascript的pa ... -
JavaScript FSO属性大全
2009-07-10 16:55 1845什么是FSO? FSO 即 Fil ... -
你不知道的 JavaScript - “this”
2009-06-24 16:45 1277JavaScript 里的 this 到底指得是什么?很多 ... -
Javascript中this的用法小结
2009-06-24 16:26 23761. 概述 this是面向对象 ... -
javascript窗口属性示意图
2007-03-15 10:15 936javascript窗口属性示意图 ------------ ...
相关推荐
详细讲解IE和Firefox中css和javascript的差异和兼容!
Javascript在IE和FireFox中的不同表现,总结IE和火狐的差异。
总结一部分IE和Firefox的javascript差异写法,对于像书写多浏览器兼容性更好的代码,可以参考下。
主要为大家详细介绍了IE和Firefox之间在JavaScript语法上的差异,在JavaScript语法上不同的7个方面,感兴趣的小伙伴们可以参考一下
为此,主要从以下几方面差异总结IE和Firefox的Javascript兼容性: 一、函数和方法差异; 二、样式访问和设置; 三、DOM方法及对象引用; 四、事件处理; 五、其他差异的兼容处理。 一、函数和方法差异 1. getYear()...
尽管那需要用长串的、沉闷的不同分支代码来应付不同浏览器的日子已经过去,偶尔还是有必要做一些简单的区分和目标检测来确保某块代码能在用户的机器上正常运行。
我们经常在处理ie和firefox下的js总会碰到一些兼容问题,下面是些总结,希望大家仔细看看研究
document.documentElement.scrollTop在Chrome里总为0document.body.scrollTop 在IE和firefox里总为01、各浏览器下 window.pageYOffset/document.documentElement.scrollTop/document.body.scrollTop的差异示例:...
这也造成了在不同的浏览器中处理event的差异,这里结合一些零碎的代码来说明如何做到event在IE4+和Firefox下的正常工作。首先看如下代码: 代码如下: function doEventThing(eventTag){ var event = eventTag||...
为此,主要从以下几方面差异总结IE和Firefox的Javascript兼容性: 代码如下:一、函数和方法差异;二、样式访问和设置;三、DOM方法及对象引用;四、事件处理;五、其他差异的兼容处理。 一、函数和方法差异 1. ...
这篇文章中,我会略述一下 Internet Explorer 和 Firefox 在 JavaScript 语法上不同的 7 个方面。 1. CSS “float” 属性 获取给定对象的特定 CSS 属性的基本语法是 object.style 属性,而且有连字符的属性要用骆驼...
1,IE6/7/8/9中无事件(如click,mouseover),Firefox/Safari/Chrome/Opera则有。 代码如下: <select id=”s1″ multiple=”multiple”> ”1″ xss=removed>1</option> ”2″ xss=removed>2</option> </...
现在我把正则表达式在五大主流浏览器(IE、Firefox、Chrome、Safari、Opera,以当前版本为准)之间的差异整理一下罗列出来,给大家,也算给我自己做一个备忘。 1、Firefox和Chrome会过度优化在循环(以及其中内嵌的...
主要介绍了jQuery 中DOM 操作详解,以及在火狐和IE之间的13点JavaScript差异,需要的朋友可以参考下