教学之友,学习之友。

站长教学网

当前位置: 站长教学网 > 前端开发 > JS教程 >

8个常用的js脚本在ie和firefox兼容写法

时间:2012-04-06 01:02来源:未知 作者:ken 点击:
1.获取控件用document.getElementById,不用document.all(FF等浏览器不支持)
2.<button> 会被firefox解释为提交form或者刷新页面,需要写标准<button type="button">
3.使用childNode()代替之前的children 
4. 手型鼠标指针请用cursor:pointer,不用 cursor:hand
5.获取自己定义的属性 用  document.getElementByID("TD1").getAttribute("isOBJ")  代替document.getElementByID("TD1").isOBJ
6.事件追加方法attachEvent(IE)/detachEvent;addEventListener( Mozilla, Netscape, Firefox)/removeEventListener
  又或者直接用obj.onmouseover=func;
7.Firefox中不存在 Event时间,必须通过object本身去取
   在Firefox获取当前物件的坐标方法:
  document.onmousemove = Inti_move;
  function  Inti_move(ert)
{
  x=ert.pageX;
}
表4 Mozilla与IE之间的事件属性差异
Internet Explorer Name Mozilla Name Description
altKey altKey Boolean property that returns whether the alt key was pressed during the event.
cancelBubble stopPropagation() Used to stop the event from bubbling farther up the tree.
clientX clientX The X coordinate of the event, in relation to the element viewport.
clientY clientY The Y coordinate of the event, in relation to the element viewport.
ctrlKey ctrlKey Boolean property that returns whether the Ctrl key was pressed during the event.
fromElement relatedTarget For mouse events, this is the element from which the mouse moved away.
keyCode keyCode For keyboard events, this is a number representing the key that was pressed. It is 0 for mouse events.
returnValue preventDefault() Used to prevent the event's default action from occurring.
screenX screenX The X coordinate of the event, in relation to the screen.
screenY screenY The Y coordinate of the event, in relation to the screen.
shiftKey shiftKey Boolean property that returns whether the Shift key was pressed during the event.
srcElement target The element to which the event was originally dispatched.
toElement currentTarget For mouse events, this is the element to which the mouse moved.
type type Returns the name of the event.

8>event.keyCode的問題解決
在FF中不存在window.event.keyCode屬性。可以用以下方法解決:站长教学网 eduyo.com

function keepKeyNum(evt)
{
        
var  k=window.event?evt.keyCode:evt.which;
        
if ((k<=57&& (k>=48))
                
{return true;}
        
else 
                
{return false;}
}
 !input type="text" onKeyPress=" return keepKeyNum(event);" >


鼠标当前坐标(加上滚动条滚过的距离)
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)。

 

(责任编辑:ken)
TAG标签: ie js firefox 脚本 兼容
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
注册登录:不允许匿名留言,登录后留言无需输入验证码。
栏目列表
最新内容