快捷導(dǎo)航

js簡(jiǎn)單實(shí)現(xiàn)交換Li的值

更新時(shí)間：2014年05月22日 09:10:10 作者：

這篇文章主要介紹的是通過js簡(jiǎn)單實(shí)現(xiàn)交換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]; 
//判斷是否是標(biāo)簽 
if (myli.nodeType == 1) { 
//和下面的一個(gè)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> 

您可能感興趣的文章:

Li的值

相關(guān)文章

JavaScript在IE和Firefox上的差異及相互替代的實(shí)現(xiàn)方法
我們經(jīng)常在處理ie和firefox下的js總會(huì)碰到一些兼容問題，下面是些總結(jié)，希望大家仔細(xì)看看研究
2008-06-06
使用plupload自定義參數(shù)實(shí)現(xiàn)多文件上傳
這篇文章主要介紹了使用plupload自定義參數(shù)實(shí)現(xiàn)多文件上傳的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-07-07
使用JavaScript和HTML實(shí)現(xiàn)一個(gè)精美的計(jì)算器
計(jì)算器是我們?nèi)粘Ｉ钪薪?jīng)常使用的工具之一,可以幫助我們進(jìn)行簡(jiǎn)單的數(shù)學(xué)運(yùn)算,在本博文中,我將使用JavaScript編寫一個(gè)漂亮的計(jì)算器,并添加加減乘除功能,感興趣的同學(xué)可以自己動(dòng)手嘗試一下
2023-09-09
JavaScript數(shù)組去重的幾種方法詳談
這篇文章給大家總結(jié)下JavaScript數(shù)組去重的幾種方法，面試中也經(jīng)常會(huì)遇到這個(gè)問題。文中給大家引申的還有合并數(shù)組并去重的方法，感興趣的朋友跟隨腳本之家小編一起學(xué)習(xí)吧
2021-10-10
解決bootstrap中使用modal加載kindeditor時(shí)彈出層文本框不能輸入的問題
這篇文章主要介紹了解決bootstrap中使用modal加載kindeditor時(shí)彈出層文本框不能輸入的問題,需要的朋友可以參考下
2017-06-06
JavaScript動(dòng)畫原理之如何使用js進(jìn)行動(dòng)畫效果的實(shí)現(xiàn)
在現(xiàn)在做頁(yè)面很多時(shí)候都會(huì)用上動(dòng)畫效果,比如下拉菜單,側(cè)邊搜索欄,層的彈出與關(guān)閉等等,下面這篇文章主要給大家介紹了關(guān)于JavaScript動(dòng)畫原理之如何使用js進(jìn)行動(dòng)畫效果實(shí)現(xiàn)的相關(guān)資料,需要的朋友可以參考下
2023-04-04
JS圖片自動(dòng)輪換效果實(shí)現(xiàn)思路附截圖
這篇文章主要介紹了JS實(shí)現(xiàn)的圖片自動(dòng)輪換效果，有具體的實(shí)現(xiàn)思路及截圖，希望對(duì)大家學(xué)習(xí)有所幫助
2014-04-04
js實(shí)現(xiàn)翻牌小游戲
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)翻牌小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-07-07
JS簡(jiǎn)單去除數(shù)組中重復(fù)項(xiàng)的方法
這篇文章主要介紹了JS簡(jiǎn)單去除數(shù)組中重復(fù)項(xiàng)的方法,涉及javascript針對(duì)數(shù)組的遍歷、判斷與運(yùn)算相關(guān)操作技巧,需要的朋友可以參考下
2016-09-09
JavaScript開發(fā)簡(jiǎn)單易懂的Svelte實(shí)現(xiàn)原理詳解
這篇文章主要為大家介紹了JavaScript開發(fā)簡(jiǎn)單易懂的Svelte實(shí)現(xiàn)原理的內(nèi)容詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步
2021-11-11