js中的点击事件如何完成

 在网页制作过程中很多地方用到的点击事件的效果，最常见的就像大家登录QQ时，也是一个点击事件 , 如图:

点击登录时，他就会进行一次验证，用我们前面说到的正则表达式去进行验证看是否成功， 这些验证都是在点击事件中完成的，怎么完成呢，我们结合例子看

就像我们在 某宝的购物车一样，我们点击数量的加减按钮， 中间的值会改变，并且 后面的小计加 总计也会随着改变，这怎么事件呢就靠onclik() 这个属性；

```javascript
	//前面的js 代码我就不写了 大家要理解 前面有什么代码步骤
		//获取大盒子
		var oDiv = document.getElementById('wapper');
		// 通过大盒子找到 所有的 btn
		var btn = oDiv.getElementsByTagName('button');
		//给每个btn 添加函数去 改变值
		for (var i = 0, len = btn.length; i < len; i++) {
				btn[i].onclick = fun;
		}
		//我们给每个按钮 就添加了一个点击点击事件，然后我们去给点击事件添加一个方法
			function fun(){
			//这就真正的完成了一个 点击事件 ， 里面要写的东西 就是我们点击 按钮要事件的 东西
			//获取span 书数量
			var span = this.parentElement.getElementsByTagName('span')[0];
			// console.log(span);
			// console.log(this.innerHTML);
			//将获取的span 转化为 number
			var n = +span.innerHTML;
			//判断 符号 将数量++ 或-- 
			n = this.innerHTML == '+' ? ++n : n > 0? --n : n;
			// 将数量的值在传给span.innerHTNML
			span.innerHTML = n;
			
			var num = parseFloat(this.parentNode.nextElementSibling.innerHTML.slice(1));
			var dj = parseFloat(this.parentNode.previousElementSibling.innerHTML.slice(1)).toFixed(2);
			num = dj*n;
			this.parentNode.nextElementSibling.innerHTML = "￥" + num.toFixed(2);


			var ul1 = document.getElementsByTagName('ul');
			for (var i = 1,sum=0; i < ul1.length-1; i++) {
				sum+=+(ul1[i].lastElementChild.innerHTML.slice(1));
			}
			ul1[4].lastElementChild.innerHTML='￥'+sum.toFixed(2);
		
			}

后面的东西就就是一些改变值的代码， 因为没有发源代码的布局等等 就不做过多的解释！