js简单实现交换Li的值

  交接li的值.html

  

复制代码 代码如下:

  <!DOCTYPE html>

  <html xmlns="http://www.w3.org/1999/xhtml">

  <head>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

  <title>交换Li的值</title>

  <script type="text/javascript">

  window.onload= function() {

  var lis = document.getElementById("ulList").childNodes;

  for (var i = 0; i < lis.length; i++) {

  var myli = lis[i];

  //判断是否是标签

  if (myli.nodeType == 1) {

  //和下面的一个li交换位置

  myli.onclick = function() {

  if (this.nextElementSibling) {

  var nextli = this.nextElementSibling;//这里只能用this,不能用myli

  document.getElementById("ulList").insertBefore(nextli, this);

  }

  };

  }

  }

  }

  </script>

  </head>

  <body>

  <ul id="ulList">

  <li>北京</li>

  <li>山西</li>

  <li>上海</li>

  <li>天津</li>

  <li>河南</li>

  </ul>

  </body>

  </html>