首先这里声明一下，关于我测试浏览器的版本是chrome15.0.874.121 firefox 8.01 ie9 ietester
下面的代码关于声明
1：获得滚动条的情况
复制代码 代码如下:
function getscroll(){
var t, l, w, h;
if (document.documentelement && document.documentelement.scrolltop) {
t = document.documentelement.scrolltop;//滚动条的顶端
l = document.documentelement.scrollleft;//滚动条的左端
w = document.documentelement.scrollwidth;//滚动条的宽度，也就是页面的宽度
h = document.documentelement.scrollheight;//滚动条的高度
}
else
if (document.body) {
t = document.body.scrolltop;
l = document.body.scrollleft;
w = document.body.scrollwidth;
h = document.body.scrollheight;
}
return {
t: t,
l: l,
w: w,
h: h
};
}
2：获得视图浏览器的宽度高度
复制代码 代码如下:
function getpagewidth(){
var pagewidth = window.innerwidth;
if (typeof pagewindth != number) {
if (document.compatmode == css1compat) {
pagewidth = document.documentelement.clientwidth;
}
else {
pagewidth = document.body.clientwidth;
}
}
return pagewidth;
}
function getpageheight(){
var pageheight = window.innerheight;
if (typeof pagewindth != number) {
if (document.compatmode == css1compat) {
pageheight = document.documentelement.clientheight;
}
else {
pageheight = document.body.clientheight;
}
}
return pageheight;
}
3：获得当前浏览器型号 名字
复制代码 代码如下:
function(){
var sys = {};
var ua = navigator.useragent.tolowercase();
var s;
(s = ua.match(/msie ([\d.]+)/)) ? sys.ie = s[1] : (s = ua.match(/firefox\/([\d.]+)/)) ? sys.firefox = s[1] : (s = ua.match(/chrome\/([\d.]+)/)) ? sys.chrome = s[1] : (s = ua.match(/opera.([\d.]+)/)) ? sys.opera = s[1] : (s = ua.match(/version\/([\d.]+).*safari/)) ? sys.safari = s[1] : 0;
if (sys.ie != null) {
return (ie: + sys.ie);//判断ie浏览器及版本号
}
if (sys.firefox != null) {
return (firefox: + sys.firefox);//判断firefox浏览器及版本号
}
if (sys.chrome != null) {
return (chrome: + sys.chrome);//判断chrome浏览器及版本号
}
if (sys.opera != null) {
return (opera: + sys.opera);//判断opera浏览器及版本号
}
if (sys.safari != null) {
return (safari: + sys.safari);//判断safari浏览器及版本号
}
}
4：事件监听
复制代码 代码如下:
function(element, type, handler){
if (element.addeventlistener) {
element.addeventlistener(type, handler, false);
}
else
if (element.attachevent) {
element.attachevent(on + type, handler);
}
else {
element[on + type] = handler;
}
}
5：事件移除
复制代码 代码如下:
function(element, type, handler){
if (element.removeeventlistener) {
element.removeeventlistener(type, handler, false);
}
else
if (element.detachevent) {
element.detachevent(on + type, handler);
}
else {
element[on + type] = null;
}
}
6：获得event，firefox事件不断派发的时候，第一次事件会出现问题。
复制代码 代码如下:
function(event){
event = (event ? event : window.event);
if (event == null) {
var $e = function(){
var c = $e.caller;
while (c.caller)
c = c.caller;
return c.arguments[0]
};
__definegetter__(event, $e);
}
return event;
}
7：阻止默认事件
复制代码 代码如下:
function(event){
if (event.preventdefault) {
event.preventdefault();
}
else {
event.returnvalue = false;
}
}
8：不继续传播事件
复制代码 代码如下:
function(event){
if (event.stoppropagation) {
event.stoppropagation();
}
else {
event.cancelbubble = true;
}
}
9：获得event的target
复制代码 代码如下:
function(event){
return event.target || event.srcelement;
}
10：documen.doctype支持不一致 e：如果存在文档类型说明，会将其错误的解释为一个注释并把它当做comment节点，document.doctype的值始终是null。
firefox：如果存在文档类型说明，则将其作为文档的第一个子节点，document.doctype是一个documenttype节点，也可以通过firstchild或者childnodes[0]访问同一个节点。
safari、chrome、opera：如果存在文档类型说明，则将其作为解释，但不作为文档的子节点，不会出现在childnodes中的。
11：查找元素
我有时候，我真搞不明白，ie总是在搞什么，总是想标新立异。如果系统不让自带浏览器的话，我敢说，ie的份额将会更少。
如果id和name一样的话，他也将被返回
复制代码 代码如下:
在ie中，结果变化了。同样是ie，id大小写不区分
复制代码 代码如下:
不好意思，他的结果又变化了。12：如果是自定义属性的话，item.myattributs在非ie浏览器的情况下，是无法得出正确结果的。
复制代码 代码如下:
function(item,myatt){
return item.attributes[myatt].value;
}
同样的话，设置属性应该知道怎么办吧，就是赋值呗。
复制代码 代码如下:
function(item,myatt,value){
item.attributes[myatt].value=value;
}
13：元素的子节点个数
复制代码 代码如下:
first
second
third
ie结果是3，其他浏览器是7。node之间的空白符，在其他浏览器是文本节点，结果就是7。如果变成这样，
复制代码 代码如下:
firstsecondthird
这样大家的结果都是3了。
14：创立节点问题
复制代码 代码如下:
//动态添加element，所有的浏览器都可以实现
var newnode=document.createelement(input);
newnode.type=button;
newnode.value=sixth;
//在ie中可以还这么实现
var newnode= document.createelement();
15：在屏蔽右键的时候，firefox与其他的不一样，在oncontextmenu事件中。16：还有动态添加style和script的时候，ie和其他的浏览器是不一样的。具体查查。
17：对于dom2和dom3，情况更复杂了。