js简单实现交换Li的值


Posted in Javascript onMay 22, 2014

交接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>
Javascript 相关文章推荐
动态样式类封装JS代码
Sep 02 Javascript
$.extend 的一个小问题
Jun 18 Javascript
如何使用jQuery技术开发ios风格的页面导航菜单
Jul 29 Javascript
用JavaScript来美化HTML的select标签的下拉列表效果
Nov 17 Javascript
jquery实现加载进度条提示效果
Nov 23 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
Dec 01 Javascript
JavaScript中误用/g导致的正则test()无法正确重复执行的解决方案
Jul 27 Javascript
jQuery实现的放大镜效果示例
Sep 13 Javascript
详解基于webpack和vue.js搭建开发环境
Apr 05 Javascript
js实现随机数字字母验证码
Jun 19 Javascript
解决layer弹出层中表单不起作用的问题
Sep 09 Javascript
es6中使用map简化复杂条件判断操作实例详解
Feb 19 Javascript
js操作iframe父子窗体示例
May 22 #Javascript
JS实现根据当前文字选择返回被选中的文字
May 21 #Javascript
JS动态增加删除UL节点LI及相关内容示例
May 21 #Javascript
jQuery异步验证用户名是否存在示例代码
May 21 #Javascript
jQuery取id有.的值的方法
May 21 #Javascript
jQuery判断复选框是否勾选的原理及示例
May 21 #Javascript
在页面加载完成后通过jquery给多个span赋值
May 21 #Javascript
You might like
星际争霸 Starcraft 发展史
2020/03/14 星际争霸
Yii2.0多文件上传实例说明
2017/07/24 PHP
php获取ajax的headers方法与内容实例
2017/12/27 PHP
javascript转换字符串为dom对象(字符串动态创建dom)
2010/05/10 Javascript
jQuery之选择组件的深入解析
2013/06/19 Javascript
js对图片base64编码字符串进行解码并输出图像示例
2014/03/17 Javascript
js中json处理总结之JSON.parse
2016/10/14 Javascript
基于vue的fullpage.js单页滚动插件
2017/03/20 Javascript
JavaScript中三个等号和两个等号你了解多少
2017/07/04 Javascript
jQuery实现页码跳转式动态数据分页
2017/12/31 jQuery
详解如何在Javascript和Sass之间共享变量
2019/11/13 Javascript
JS常见内存泄漏及解决方案解析
2020/05/30 Javascript
[46:47]完美世界DOTA2联赛PWL S2 FTD vs Magma 第二场 11.20
2020/11/23 DOTA
python自定义解析简单xml格式文件的方法
2015/05/11 Python
Python使用email模块对邮件进行编码和解码的实例教程
2016/07/01 Python
python实现折半查找和归并排序算法
2017/04/14 Python
PyQt5实现拖放功能
2018/04/25 Python
python实现将一个数组逆序输出的方法
2018/06/25 Python
python中的插值 scipy-interp的实现代码
2018/07/23 Python
在unittest中使用 logging 模块记录测试数据的方法
2018/11/30 Python
如何通过python实现人脸识别验证
2020/01/17 Python
pycharm 更改创建文件默认路径的操作
2020/02/15 Python
python torch.utils.data.DataLoader使用方法
2020/04/02 Python
Python制作一个仿QQ办公版的图形登录界面
2020/09/22 Python
Canvas实现保存图片到本地的示例代码
2018/06/28 HTML / CSS
简单的JAVA编程面试题
2013/03/19 面试题
不拖欠农民工工资承诺书
2014/03/31 职场文书
机械加工与数控专业自荐书
2014/06/04 职场文书
入党积极分子学习优秀共产党员先进事迹思想汇报
2014/09/13 职场文书
2014年标准化工作总结
2014/12/17 职场文书
展览会邀请函
2015/02/02 职场文书
小学体育课教学反思
2016/02/16 职场文书
2020优秀员工演讲稿(三篇)
2019/10/17 职场文书
Python编写nmap扫描工具
2021/07/21 Python
基于python定位棋子位置及识别棋子颜色
2021/07/26 Python
如何利用React实现图片识别App
2022/02/18 Javascript