IE和Firefox在JS和CSS方面的兼容性
1.document.formName.item("itemName") 问题
说明:IE下,可以使用document.formName.item("itemName")或document.formName.elements["elementName"];
Firefox下,只能使用document.formName.elements["elementName"].
解决方法:统一使用document.formName.elements["elementName"].
2.集合类对象问题
说明:
IE下,可以使用()或[]获取集合类对象;
Firefox下,只能使用[]获取集合类对象.
解决方法:统一使用[]获取集合类对象.
3.自定义属性问题
说明:
IE下,可以使用获取常规属性的方法来获取自定义属性,也可以使用getAttribute()获取自定义属性;
Firefox下,只能使用getAttribute()获取自定义属性.
解决方法:统一通过getAttribute()获取自定义属性.
4.eval("idName")问题
说明:
IE下,,可以使用eval("idName")或getElementById("idName")来取得id为idName的HTML对象;
Firefox下只能使用getElementById("idName")来取得id为idName的HTML对象.
解决方法:统一用getElementById("idName")来取得id为idName的HTML对象.
5.变量名与某HTML对象ID相同的问题
说明:
IE下,HTML对象的ID可以作为document的下属对象变量名直接使用;
Firefox下则不能。Firefox下,可以使用与HTML对象ID相同的变量名;IE下则不能。
解决方法:使用document.getElementById("idName")代替document.idName.最好不要取HTML对象ID相同的变量名,以减少错误;在声明变量时,一律加上var,以避免歧义.
6.const问题
说明:
Firefox下,可以使用const关键字或var关键字来定义常量;
IE下,只能使用var关键字来定义常量.
解决方法:统一使用var关键字来定义常量.
7.input.type属性问题
说明:IE下input.type属性为只读;但是Firefox下input.type属性为读写.
8.window.event问题
说明:window.event只能在IE下运行,而不能在Firefox下运行,这是因为Firefox的event只能在事件发生的现场使用.
解决方法:
IE:
程序代码
<input name="Button8_1" type="button" value="IE" onclick="javascript:gotoSubmit8_1()"/>
...
<script language="javascript">
function gotoSubmit8_1() {
...
alert(window.event); //use window.event
...
}
</script>
IE&Firefox:
程序代码
<input name="Button8_2" type="button" value="IE" onclick="javascript:gotoSubmit8_2(event)"/>
...
<script language="javascript">
相关文档:
CSS代码
<style>
body{
background-color:#f4f4f4;
font-size:12px;
}
div.test{
width:200px;
height:100px;
border:1px solid red;
border-top:4px solid red;
padding:10px;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
</style>
HTML代码
<div class="test"&g ......
嵌入式SGF查看和编辑器
EidoGo Player
(SGF viewer and editor) 是一款开源(AGPLv3
许可)纯javascript+css编写、在浏览器内运行的围棋打谱、编辑软件。
可嵌入到任何页面,提供打谱、编辑SGF棋谱。
源代码:http://code.google.com/p/eidogo/
例子:第24届天元战本赛第1轮 2010-01-27 常昊vs罗洗河 白中盘胜
(
......
用JavaScript修改网页样式
一、局部改变样式
分为改变直接样式,改变className和改变cssText三种。需要注意的是:
注意大小写
:
javascript对大小写十分敏感,className不能够把“N”写成“n”,cssText也不能够把“T”写成“t”,否则无法实现效果。
调用方法
:
如果改 ......
position 有三个值,static(静态)、relative(相对)、absolute(绝对) fix(固定布局);由于static是所有页面元素的默认值,因此设置元素的定位类型时几乎不用这个值,除非用于覆盖之前的定义。
对于后两者,一般应用:在一个相对定位的元素里面放置一个绝对定位的元素,如图:
子元素B可以通过top、right、bottom、le ......