[JavaScript/JQuery] js数组删除，新增，元素删除，事件绑定

javascript返回某个元素在数组中的索引值的indexOf方法–兼容所有浏览器 在现在代浏览器中判断一个元素在不在一个数组中，咱们可以用Array对象的indexOf()方法来取得这个元素在当前数组中的索引值，若索引值不等于-1，数组中就存在这个元素，例如：

1. var arr = [2,53,23,'test',9,'array'];
2. //判断array在不在数组arr中http://www.nvzi91.cn/gongjingfeida/30044.html
3. arr.indexOf('array') !== -1 ? alert('存在') : alert('不存在');

复制代码

但是IE9以前的版本都不支持此方法，那咱们就只能扩展一个：

1. Array.prototype.indexOf = function(el){
2. for (var i=0,n=this.length; i<n; i++){
3. if (this[i] === el){
4. return i;
5. }http://www.nvzi91.cn/gongjingmilan/30045.html
6. }
7. return -1;
8. }

复制代码

下面咱们就来检测一下各个浏览器的兼容性，代码如下：

1. var arr = [2,53,23,'test',9,'array'];
2. if(!Array.indexOf){
3. Array.prototype.indexOf = function(el){
4. for (var i=0,n=this.length; i<n; i++){
5. if (this[i] === el){
6. return i;
7. }
   http://www.nvzi91.cn/fukezhongliu/30046.html
   
   
9. return -1;
10. }
11. }http://www.nvzi91.cn/gongjingxirou/30047.html
12. arr.indexOf('array') !== -1 ? alert('存在') : alert('不存在');

复制代码

上面就是用Array的indexOf方法来判断数组中一个元素是否存在的方法。

数组根据索引删除元素：

Array.prototype.del=function(n) { //n表示第几项，从0开始算起。
//prototype为对象原型，注意这里为对象增加自定义方法的方法。
if(n<0) //如果n<0，则不进行任何操作。
return this;
else
return this.slice(0,n).concat(this.slice(n+1,this.length));
/*http://www.nvzi91.cn/gongjingyan/30048.html
concat方法：返回一个新数组，这个新数组是由两个或更多数组组合而成的。
这里就是返回this.slice(0,n)/this.slice(n+1,this.length)
组成的新数组，这中间，刚好少了第n项。
slice方法： 返回一个数组的一段，两个参数，分别指定开始和结束的位置。
*/
}

JS绑定事件

事件是用户或浏览器自身进行的特定行为.这些事件都有自己的名字,如click(点击),load(载入),mouseover(鼠标经过).用于响应某个事件而调用的函数称为"事件处理函数"或者"事件监听函数".事件处理函数有两种分配方式:

1)在HTML页面中:

//点击后执行JS代码中已经定义好的函数:doSome; 

2)在JS中: 
var oDiv = document.getElementByIdx_x("testDiv"); 
oDiv.onclick = function() 
{ 
alert("我被点!"); 
} www.nvzi91.cn
注意:用这个分配方法时,事件处理函数名称必须小写nclick,onmouseover

用其它方法绑定事件: 
//兼容的方法 

var EventUtil = new Object; 
EventUtil.addEventHandler = function(oTarget, sEventType, fnhandler) 
{ 
if(oTarget.addEventListener) 
{ 
oTarget.addEventListener(sEventType, fnhandler, false); 
}//这里用了对象检测方法判断浏览器,最后的参数false表示事件在捕获阶段,若为true则表示在冒泡阶段 
else if(oTarget.attachEvent) 
{ 
oTarget.attachEvent("on" + sEventType, fnhandler); 
} 
else 
{ 
oTarget["on" + sEventType] = fnhandler; 
} 
} 

EventUtil.removeEventHandler = function(oTarget, sEventType, fnhandler) 
{ 
if(oTarget.removeEventListener) 
{ 
oTarget.removeEventListener(sEventType, fnhandler, false); 
} 
else if(oTarget.detachEvent) 
{ 
oTarget.detachEvent("on" + sEventType, fnhandler); 
} 
else 
{ 
oTarget["on" + sEventType] = null; 
} 
} 
function handleClick() 
{ 
alert(oDiv.style.backgroundColor); 
// EventUtil.removeEventHandler(oDiv, "click", handleClick); 
} 
EventUtil.addEventHandler(oDiv, "click", handleClick);//添加事件 在 for 循环中动态添加事件： for(var i=; i<6; i++){ var alink = document.createElement_x('a'); var titleText = document.createTextNode(' ' + (i+1) + ' '); alink.a(titleText); alink.href = "javascript:void(0)"; alink.onclick = function(){alert(i)}; var div = document.getElementById('show-detail'); div.a(alink); } 你会发现每点击一下，结果总是6。WHY? 这是javascript闭包特性所引起

解决问题：使用代理方法

添加下面代码：

function delegate(fn,params,obj){ return function(){ fn.call(obj||window,params); } }

再将 : alink.onclick = function(){alert(i)};

改为 :

var pFunc = function(i){alert(i)};
alink.onclick = delegate(pFunc,i,alink);

即可。