javascript学习笔记_1
1、JSON的遍历
for(var i in json){
alert(json[i];
}
2、arguments 可以理解为是一个数组,并且建有json的部分能力
css(obj,attr,value){
obj.attr = value;
}
3、字符串的单字符获取方法
str.charAt(index); // 兼容全部浏览器
str[index]; // 低版本浏览器不兼容
附记：
1、获取元素在样式表中定义的属性值
var getStyle = function(node, property){
if (node.style[property]) {
return node.style[property];
}
else if (node.currentStyle) {
return node.currentStyle[property];
}
else if (document.defaultView && document.defaultView.getComputedStyle){
var style = document.defaultView.getComputedStyle(node, null);
return style.getPropertyValue(property);
}
return null;
};
2、常用JS工具
var utils = {
// 创建固定ID的标签
createE:function(nodeName,id){var newEl = document.createElement(nodeName);if(id&&id!==""&&!document.getElementById(id)){newEl.id = id;}return newEl;},
// 根据class Name获取元素集合
getByC:function(className){return document.getElementsByClassName(className);},
// 根据ID获取标签
getById:function(id){return document.getElementById(id);},
// 根据DOM对象和属性名获取属性值，解决获取样式时的兼容问题，
// 兼容各种浏览器和行间样式与CSS样式
getStyle:function(el,name){
var stl = '';
try{
stl = el.style[name];
if(stl==''){throw false;}
}catch(e){
try{
stl = el.currentStyle[name];
}catch(e1){
try{
stl = window.getComputedStyle(el,null)[name];
}catch(e2){
}
}
}finally{
return stl;
}
},
// 渐变效果，通常用于width\height\left\right\top\bottom等
huadong:function(el,name,target,timer){var old=utils.getStyle(el,name);if(!el||!name||!target||!/^-?\d+/.test(target)||!/^-?\d+/.test(old)){return;}
clearInterval(timer);var o=parseInt(old),t=parseInt(target),c=t-o,step=c>0?2:c<0?-2:0;timer=window.setInterval(function(){o+=step;utils.setStyle(el,name,o+'px');if((c>0&&o>=t)||(c<=0&&o<=t)){clearInterval(timer);}},10);},
};
3、小工具：
获取鼠标点击的“目标对象”：event.target, IE下为event.srcElement
示例代码：
<html>
<head>
<script type="text/javascript">
function whichElement(e) // 获取鼠标点击对象的方法
{
var targ
if (!e) var e = window.event // 如果e不存在
if (e.target) targ = e.target // 事件目标节点（不兼容IE）
else if (e.srcElement) targ = e.srcElement // IE下为event
if (targ.nodeType == 3) // 当点击了文本节点Text
targ = targ.parentNode // 文本节点的父节点
var tname
tname=targ.tagName // 元素类型
alert("You clicked on a " + tname + " element.")
/* 简写：
e = e ? e : window.event;var targ = e.target ? e.target : e.srcElement ? e.srcElement : null;targ = targ.nodeType == 3 ? targ.parentNode:targ;
*/
}
</script>
</head>
<body onmousedown="whichElement(event)">
<p>在文档中点击某个位置。消息框会提示出您所点击的标签的名称。</p>
<h3>这是标题</h3>
<p>这是段落。</p>
<img src="/i/eg_mouse2.jpg" />
</body>
</html>
4、延伸扩展：如何判断当前浏览器是什么浏览器？
简而言之，每个浏览器的独有属性的一个罗列：
总所周知：当下比较常用的有Firefox（火狐浏览器）、Opera（欧鹏浏览器）、Safari（苹果公司的网络浏览器）、
Chrome（谷歌浏览器）；下面一一对各个浏览器相对独有的特性进行一个描述（暂时不谈论内核的差距，主要是从相关函数进行分析）。
Firefox中的DOM元素都有一个getBoxObjectFor函数，用来获取该DOM元素的位置和大小
IE对应的中是getBoundingClientRect函数）。这是Firefox独有的，判断它即可知道是当前浏览器是Firefox。
Opera提供了专门的浏览器标志，就是window.opera属性。
Safari浏览器中有一个其他浏览器没有的openDatabase函数，可做为判断Safari的标志。
Chrome有一个MessageEvent函数，但Firefox也有。不过，好在Chrome并没有Firefox的getBoxObjectFor函数，
根据这个条件还是可以准确判断出Chrome浏览器的。
