<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript"> //枚举算法--》穷举算法 window.onload=function () { var aA=document.getElementsByTagName('a');//get A var oUl=document.getElementById('uli');//get ul var aLi=document.getElementsByTagName('li');//get li for (var i = 0; i < aA.length; i++) {//给A加入点击事件 aA[i].onclick=function () {//给每一个里加入点击事件 if(mj(this.innerHTML)){//没有同样的 var oLi=document.createElement('li'); oLi.innerHTML=this.innerHTML; if(aLi[0]){ oUl.appendChild(oLi);//第一次显 }else{ oUl.insertBefore(oLi, aLi[0])//仅仅要点击即显示在最前面 } }else{//有同样的。不再显示 mj2(this.innerHTML); } }; }; function mj (text) {//推断是否存在相通的Li var result=true; for (var i = 0; i < aLi.length; i++) { if(aLi[i].innerHTML==text){ result=false; } }; return result; } function mj2 (text) {//存在同样的li时。将当前的Li加入在第一个位置! for (var i = 0; i < aLi.length; i++) { if(aLi[i].innerHTML==text){ oUl.insertBefore(aLi[i], aLi[0]) } }; } } </script> </head> <body> <a href="javascript:;">北京</a> <a href="javascript:;">上海</a> <a href="javascript:;">杭州</a> <a href="javascript:;">天津</a> <a href="javascript:;">武汉</a> <a href="javascript:;">长沙</a> <a href="javascript:;">广州</a> <a href="javascript:;">神州</a> <ul id="uli"> </ul> </body> </html>
1、点击当中一个。显示在最前面!
2、当点击第二次的时候。不再显示!!