源码:http://yun.baidu.com/share/link?shareid=2310452098&uk=1997604551
1、感觉在写js的时候,最好先理清思路,先干什么,在干什么,不要想到哪里写到哪里;
2、一定要学会调试js,不然你哗哗写了好多,结果一运行,却不知问题出到哪里,那就是浪费时间;
3、正则表达式的写法,以及如何运用,有两种方式,分别采用test()和match();
var pattern=/^[+,-]?\d+$/;
iptValue=ipt.value.trim();
if(!pattern.test(iptValue)){
alert("请确认输入的是数字?");
return;
}
if(!city.match(/^[A-Za-z\u4E00-\u9FA5]+$/)){
alert("城市名必须为中英文字符!")
return;
}
4、事件的绑定,IE和其他浏览器的区别,这段代码可以保存起来,用到的概率很大
//绑定事件函数
function on(element,eventName,listener){
if (element.addEventListener){
element.addEventListener(eventName,listener,false);
}
else if (element.attachEvent){
element.attachEvent('on'+eventName,listener);
}
else
element['on'+eventName]=listener;
}
on(mybt,'click',addBtnHandle);
5、就是如何获取事件对象和目标
//获取事件对象和事件的目标
var EventUtil={
getEvent:function(event){
return event ? event:window.event;
},
getTarget:function(event){
return event.target||event.srcElement;
}
}
6、事件委托实现。将事件绑定在多个兄弟元素的父元素上,再通过target.id来确定是那个元素是目标id了;部分代码摘入如下。
event=EventUtil.getEvent(event);
var target=EventUtil.getTarget(event);
var tt;
switch(target.id){//
case "l-input":
if (validate()){
t.unshift(ipt.value);
}
break;
case "r-input":
if (validate()){
t.push(ipt.value);
}
break;
7、下面两段涉及到很多知识,包括removeChild, target.tagName.toLowerCase(), target.dataset.num,(e.g. data-num="2"); parseInt;parentNode等等。
event=EventUtil.getEvent(event);
var target=EventUtil.getTarget(event);
if (target.tagName.toLowerCase() === 'span') {//记得要转化为小写;
numUl.removeChild(target);
var tt=target.dataset.num;//如何获取自定义元素的值;
removeData(tt);
alert("移除"+target.innerHTML);//innerHTML也可以用来读;
} //第二段代码
event=EventUtil.getEvent(event);
var target=EventUtil.getTarget(event);
var tt=target.parentNode.dataset.num;//父节点的获取
tt=parseInt(tt);
if (target.parentNode.tagName.toLowerCase() === 'span') {
numUl.removeChild(target.parentNode);
alert("移除"+removeData(tt));
}
8、排序,冒泡排序也不会写了....我就是个坑。
每次比较相邻的两个数,一次循坏结束,最后一个就是最大或者最小的,因此,第二次循坏比较的时候,要减少一次比较的次数,这样一直比较下去。
for(var i=0;i<length-1;i++){
for(var j=0;j<length-i-1;j++){
if (t[j]>t[j+1]){
tem=t[j];
t[j]=t[j+1];
t[j+1]=tem;
}
}
}
9、在你用js将text输入到htmL的时候,可以添加class,自定义属性,id等等,这样就可以在设置css的时候,或者js中派上用场。
10、如何创建一个元素,并向其中加入子元素和内容等。还有为其设置style属性。
var newSpan = document.createElement('span');
var newSpanText = document.createElement('div');
newSpan.style.position = 'relative';
newSpanText.innerHTML = numbers[i];
newSpanText.style.position = 'absolute';
newSpanText.style.bottom = '-1.5em';
newSpan.style.width = '20px';
newSpan.style.height = numbers[i] + 'px';
newSpan.appendChild(newSpanText);
switch (method) {
case 'leftIn':
result.insertBefore(newSpan, spans[0]);
break;
case 'rightIn':
result.appendChild(newSpan);
break;
}
未来路还很长,继续加油。