js对div,li,ul的基本操作

原先的div

<div class="wrapper-title">  选择下一节点处理人 <label class="wrapper_finish">完成</label></div>
		<div class="mui-scroll-wrapper">
			<div class="scoll_box" id="scoll_box"></div>
			<div class="mui-scroll">
				<ul class="mui-table-view" id="mui-table-view">
					<li class="mui-table-view-cell" id="selNode" value="1111"><a href="javascript:changeNode()">显示的内容</a></li>
				 </ul>
			</div>
		</div>

js对div的操作

function changeGroup(){
	var content = $("#mui-table-view").children("li");//获得id为mui-table-vie的ul的下面的li
	//获取value属性的值
	var value = content[nodeIndex].getAttribute("value");
	//清空id为scoll_box的div
	document.getElementById("scoll_box").innerHTML = "";
	
	var xmlHttp = createXMLHttpRequest();
	xmlHttp.onreadystatechange = function() {
		if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
			var groups = eval(xmlHttp.responseText);
			for (var i = 0; i < groups.length; i++) {
				oOption = document.createElement("OPTION");
				oOption.text = groups[i].substring(groups[i].lastIndexOf("/") + 1);
			    oOption.value = groups[i];

			    //新增一个div
			    var newchild = document.createElement("div");
				//设置新增的div的class属性
			    newchild.className = "box-tag";
			    //设置新增的div的内容
			    newchild.innerHTML = "<span class=\"box-tag1\"><a href=\"javascript:addUser()\">"+oOption.text+"</a></span>" ;
				//追加,不是覆盖原来的div内容
			    document.getElementById("scoll_box").appendChild(newchild);
			}
			xmlHttp = null;
		}
	}
	xmlHttp.open("POST","work_seluser_data.jsp?type=role&id=all",true);
	xmlHttp.send(null);
}

其他操作

$("#mui-table-view").find("li").remove();//清空右边的li

var s=document.getElementById("mui-table-view");
			   var li= document.createElement("li");//新增一个li
			    li.className="mui-table-view-cell" ;//设置新增的li的class属性
			    
				oOption = document.createElement("OPTION");
				oOption.text = groups[i].substring(groups[i].lastIndexOf("/") + 1);
			    oOption.value = groups[i];
				
			    li.setAttribute("value", oOption.text);//设置新增的li的value属性
				li.innerHTML = "<a href=\"javascript:changeGroup("+ i +");\">"+oOption.text+"</a>";//设置新增的li的显示的内容
				s.insertBefore(li,s.childNodes[i]);//将li追加的ul中
				document.getElementById("scoll_box").innerHTML = "";//清空id为scoll_box的div