JavaScript 总结使用
上个星期,公司分派了任务给我,让我进行html原型开发。由于原型需要一些特效及在ie及firefox两种浏览器兼容运行,所以我在原型开发中所使用的大量javascript需要进行修改,因此我在这过程中掌握了更多javascript的使用方法,并对其进行做了归纳。
总结如下:
1.
offsetLeft
使用
offsetLeft获得的数值是相对于父级元素的左坐标单位,因此,某一控件在几级元素内,使用offsetLeft是无法获取该控件在body所处的位置。因此我们可通过以下方法获得某一控件相对body的offsetLeft.
function GetX(o){
var nLt=0;
var offsetParent = o;
while (offsetParent!=null && offsetParent!=document.body) {
nLt+=offsetParent.offsetLeft; parseInt(offsetParent.style.borderLeftWidth)>0?nLt+=parseInt(offsetParent.style.borderLeftWidth):"";
offsetParent=offsetParent.offsetParent;
}
return nLt;
}
2.
创建元素总结
var c=document.createElement("input");
一般元素创建就是这样,然后添加属性,就可以有我们想要的组件
但是有些属性添加上去并不起作用.这样就只有通过javascript去实现
而且方法一定要通过定义其function才起作用,不能当作attribute进行添加.
Eg:
var c=document.createElement("input");
if (type==""){type="text";}
if (type!="") c.setAttribute("type",type);
if (classname!="") c.setAttribute("className",classname);
if (ro!="") c.readOnly=ro;
if (id!="") c.setAttribute("id",id);
if (size!="") c.setAttribute("size",size);
if (value!="") c.setAttribute("value",value);
if (methodName!=""||method!="")
{
if (methodName=="onclick")
{
c.οnclick=function() {
eval(method);
}
}
else if (methodName=="ondblclick")
{
c.οndblclick=function() {
eval(method);
}
}
else if (methodName=="onblur")
{
c.οnblur=function() {
eval(method);
}
}
}
return c;
3.
正则表达式校验
定义正则表达式: var regularExpression =/^/d{1,2}:/d{1,2}$/;
实现匹配对比:if(!regularExpression.test(time))
4.
鼠标位置
我们点击鼠标获取的位置是以当前窗口左上角作为0,0 因此该点坐标跟实际的坐标有所偏差,因此必须所获得的鼠标位置再加上document.body.scrollLeft及 document.body.scrollTop
5.
事件加载
//事件监听事件(要在bodyLoad事件使用)
function initEvent(){
document.onmousedown = judgeShowDiv;
}