xmlDoc，xmlHttp

最新推荐文章于 2024-06-03 15:01:32 发布

原创最新推荐文章于 2024-06-03 15:01:32 发布 · 154 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#XML #IE #Microsoft #Ajax #HTML

本文介绍了一个使用AJAX进行用户验证的例子，并演示了如何通过JavaScript操作XML文档，包括读取XML数据、按XPath查询节点及属性值、遍历XML文档等。此外，还展示了如何将数据写入文件。


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<script type="text/javascript">
 <!--
 var xmlHttp ;//发送请求接受响应
 function createXMLHttpRequest(){
 if(window.ActiveXObject){
 xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") ;
 }
 else if(window.XMLHttpRequest){
 xmlHttp = new XMLHttpRequest() ;
 }
 }
 function checkUser(){
 createXMLHttpRequest() ;
 var name = document.getElementById("username").value ;
 var password = document.getElementById("password").value ;
 var url = "servlet/Login_check?username="+name+"&password="+password ;
 xmlHttp.open("GET",url,true) ;
 xmlHttp.onreadystatechange = showResult ;
 xmlHttp.send(null) ;
 }
 //回调函数
 function showResult(){
 if(xmlHttp.readyState == 4){
 if(xmlHttp.status == 200){
 var result = xmlHttp.responseText;//在页面上显示返回的结果
 alert("result:"+result) ;
 if(result=="OK"){
    alert("if执行了么") ;
       window.location.href ="test.html?name=test" ;
 }else{
 document.getElementById("checkResult").innerHTML="<b>"+result+"</b>" ;
 }
 }
 }
 }
 //-->
 </script>
	</head>
	<body>
		ajax
		<br>
		username:
		<input type="text" id="username">
		<div id="checkResult"></div>
		<p>
			password:
			<input type="password" id="password">
		<p>
			<input type="button" value="check" onclick="checkUser()">
		<p>
	</body>
</html>

----------------------------------------------------


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>test.html</title>

		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">

		<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

	</head>
	<script type="text/javascript">
	// 保存读到的XML
	var xml = null;
	var CurrentDate;
	/* 获取XML对象 */
	function loadXmlDoc(xmlUrl) {
		try {
			//创建IE的xml文档
			xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
		} catch (e) {
			try {
				//创建FF的xml文档
				xmlDoc = document.implementation.createDocument("", "", null);
			} catch (e) {
				alert(e.message)
			}
		}
		try {
			//关闭异步加载
			xmlDoc.async = false;
			xmlDoc.load(xmlUrl);
			return (xmlDoc);
		} catch (e) {
			alert(e.message)
		}
		return (null);
	}

	function getPropValues() {

		var nodeName = document.getElementById("nodeName").value;
		var propName = document.getElementById("propName").value;
		alert(propName + "这。");
		if (nodeName == "") {
			alert("输入结点名");
			return;
		}

		if (xml == null) {
			xml = loadXmlDoc("data.xml");
			alert("DOM对象以创建");
		}
		// 返回文档中具有指定标记名的所有Element节点
		var nodes = xml.getElementsByTagName(nodeName);

		if (nodes == null) {
			document.getElementById("result").innerText = "所输入的结点名不存在";
			return;
		}

		var results = "";
		if (propName != "" && nodes[0].getAttribute(propName) == null) {
			document.getElementById("result").innerText = "结点不存在所输入 的属性名";
			return;
		}
		for ( var i = 0; i < nodes.length; i++) {
			if (propName != null && propName != "") {
				results += nodes[i].getAttribute(propName) + "\n";
			} else {
				alert("执行了么~");
				results += nodes[0].childNodes[0].nodeValue + "\n"; //childNodes  以Node的形式存放当前节点的子节点。如果没有子节点，则返回空数组。  
			}
		}
		document.getElementById("result").innerHTML = results;
	}

	//根据xpath返回xml节点
	function readXmlNode(node, xpath) {
		try {
			if (node == null || xpath == null) {
				return null;
			} else {
				var result = node.selectSingleNode(xpath);
				if (result == null) {
					return null;
				} else {
					return result;
				}
			}
		} catch (e) {

			return null;
		}

	}

	//根据xpath取xml节点属性的值
	function readXmlAttrValue(node, xpath, attrName) {
		try {
			if (node == null || xpath == null) {
				return null;
			} else {
				var result = node.selectSingleNode(xpath);
				if (result == null) {
					return null;
				} else {
					return result.getAttribute(attrName);
				}
			}
		} catch (e) {
			return null;
		}
	}

	/*-----------------------------------------------------------------------*/
	function readTime1() {
		var date = new Date();
		CurrentDate = ChangeTimeToString(date);
		//alert("hello ");
		//alert(CurrentDate);
		var t = setTimeout("alert(CurrentDate)", 5000);

	}

	function readTime2() {
		var date = new Date();
		CurrentDate = ChangeTimeToString(date);
		//alert(CurrentDate);
		var t = setInterval("alert(CurrentDate)", 5000);

	}

	// 将日期类型转换成字符串型格式yyyy-MM-dd hh:mm
	function ChangeTimeToString(DateIn) {
		var Year = 0;
		var Month = 0;
		var Day = 0;
		var Hour = 0;
		var Minute = 0;
		var CurrentDate = "";

		//初始化时间
		Year = DateIn.getYear();
		Month = DateIn.getMonth() + 1;
		Day = DateIn.getDate();
		Hour = DateIn.getHours();
		Minute = DateIn.getMinutes();

		CurrentDate = Year + "-";
		if (Month >= 10) {
			CurrentDate = CurrentDate + Month + "-";
		} else {
			CurrentDate = CurrentDate + "0" + Month + "-";
		}
		if (Day >= 10) {
			CurrentDate = CurrentDate + Day;
		} else {
			CurrentDate = CurrentDate + "0" + Day;
		}

		if (Hour >= 10) {
			CurrentDate = CurrentDate + " " + Hour;
		} else {
			CurrentDate = CurrentDate + " 0" + Hour;
		}
		if (Minute >= 10) {
			CurrentDate = CurrentDate + ":" + Minute;
		} else {
			CurrentDate = CurrentDate + ":0" + Minute;
		}
		return CurrentDate;
	}

	/*------------------------------------------------------------------*/

	function writeStream() {

		var fso, tf;
		fso = new ActiveXObject("Scripting.FileSystemObject");
		tf = fso
				.CreateTextFile("D:/workspace/studyTest/WebRoot/test.txt", true);
		var textArea = document.getElementById("result")
		tf.WriteLine(textArea.innerText);
		tf.WriteBlankLines(2);
		tf.Close();
	}

	/*---------------------------------------------------------------------*/
	function findAll() {
		if (xml == null) {
			xml = loadXmlDoc("data.xml");
			//alert("DOM对象以创建");
		}
		var results = "";
		var nodes = xml.documentElement;//根节点
		var childs = nodes.childNodes;//子节点数组
		for ( var x = 0; x < childs.length; x++) {
			if (childs[x].nodeType == 1) {
				var child = childs[x].childNodes; //子节点的下一级子节点

				for ( var y = 0; y < child.length; y++) {
					var arrylist = child[y].attributes;//属性列表
					if (arrylist.length <= 0) {
						results += child[y].nodeName + ":"
								+ child[y].childNodes[0].nodeValue + "\n";
					} else {

						for ( var z = 0; z < arrylist.length; z++) {
							//document.write(child[y].nodeName + "\n");
							//alert(arrylist[z].nodeName);
							//alert(child[y])
							results += child[y].nodeName+":"+arrylist[z].nodeName + ":"
									+ arrylist[z].nodeValue + "\n"; //arrylist[z].text获得 属性的值
						}

					}
				}

			}
		}

		document.getElementById("result").innerHTML = results;
	}

	/*---------------------------------------------------------------------------------------------------------------------*/
	function getValueByNode() {
		if (xml == null) {
			xml = loadXmlDoc("data.xml");
			alert("DOM对象已创建");
		}
		var nodeName = document.getElementById("nodeName").value;
		alert("nodeName:" + nodeName);
		var propName = document.getElementById("propName").value;
		alert("propName:" + propName);
		var results = "";
		//节点名为nodeName的所有元素节点
		if (nodeName != null && "" != nodeName) {
			var nodes = xml.getElementsByTagName(nodeName);
			alert("nodes的长度：" + nodes.length);
			if (propName != null && "" != propName) {
				for ( var x = 0; x < nodes.length; x++) {
					results += propName + ":" + nodes[x].getAttribute(propName)
							+ "\n";

				}

			} else {
				results += nodeName + ":" + nodes[0].childNodes[0].nodeValue
						+ "\n";
			}

		} else {
			alert("节点名称不能为空");
		}
		document.getElementById("result").innerText = results;
	}

	//接受网址上的参数
	function getParameter() {
	    //获得url
		var url = window.location.href;
		alert("url:"+url);
		var aa = url.indexOf('=');
		alert("aa:"+aa);
		if (aa == -1) {
			return "";
		} else {
			url = url.substring(aa + 1);
			window.alert(url);
		}
		return url;

	}

	function showView() {
		var url = getParameter();
		document.getElementById("showView").innerText = "欢迎," + url;
	}
</script>
	<body onload=showView()>
		<div id="showView"></div>
		输入结点名：
		<input type="text" id="nodeName" />
		<br />
		输入属性名：
		<input type="text" id="propName" />
		<br />
		<input type="button" value="提交" onclick="getValueByNode()" />
		<br />
		<textarea id="result" style="width: 200px; height: 60px;"></textarea>
		<br />
		<button onclick="readTime1()">
			显示当前日期1
		</button>
		<button onclick="readTime2()">
			显示当前日期2
		</button>
		<button onclick="writeStream()">
			写如文件
		</button>

		<button onclick="findAll()">
			遍历XML
		</button>
	</body>
</html>