javascript xml xsl取值及數據修改(2)_Xml教程
推薦:jstl 字符串處理函數最近用jstl1.0 的時候經常要在頁面上對字符串做改動,在網上找了一個寫的不錯的,借鑒一下
3.index.html--用javascript導入數據并能修改xml里的數據.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>測試</title>
</head>
<link rel="Stylesheet" type="text/css" href="focusform.css"/>
<script language="javascript" src="form.js"></script>
<script type="text/javascript" src="detect.js"></script>
<script type="text/javascript" src="xmldom.js"></script>
<script type="text/javascript">
//載入xml與xsl文件
var oxml = new XmlDom();
var oxsl = new XmlDom();
oxml.async = false;//同步載入
oxsl.async = false;
oxml.load("example.xml");
oxsl.load("example.xsl");
if (oxml.parseError != 0) {
var oError = oxml.parseError;
alert("An error occurred:\nError Code: "
+ oError.errorCode + "\n"
+ "Line: " + oError.line + "\n"
+ "Line Pos: " + oError.linepos + "\n"
+ "Reason: " + oError.reason);
}
if (oxsl.parseError != 0) {
var oError = oxsl.parseError;
alert("An error occurred:\nError Code: "
+ oError.errorCode + "\n"
+ "Line: " + oError.line + "\n"
+ "Line Pos: " + oError.linepos + "\n"
+ "Reason: " + oError.reason);
}
var sResult = oxml.transformNode(oxsl);
//alert(sResult);
//一些操作
function btnSub(){
var fes = document.forms[0].elements;
for(var i = 0;i<fes.length;i++){
var name = fes[i].name;
if(name.indexOf('re_')!=-1){
var xmlid=name.substring(3,name.length);
var obj;// = oxml.getElementById("items_1");//xml的dom里沒有這個方法?
var oItems1 = oxml.getElementsByTagName("items");//也可以用xpath實現。
var oItems2 = oxml.getElementsByTagName("item");
for(var j=0;j<oItems1.length;j++){
if(oItems1[j].getAttribute('id')==xmlid){
obj = oItems1[j];
break;
}
}
for(var j=0;j<oItems2.length;j++){
if(oItems2[j].getAttribute('id')==xmlid){
obj = oItems2[j];
break;
}
}
if(obj){
obj.childNodes[0].text = fes[i].value;
}else{
alert("在xml中未找到id為"+xmlid+"的items或item");
}
}
if(name.indexOf('of_')!=-1){
var xmlid=name.substring(3,name.length);
var oItems1 = oxml.getElementsByTagName("items");
var oItems2 = oxml.getElementsByTagName("item");
for(var j=0;j<oItems1.length;j++){
if(oItems1[j].getAttribute('id')==xmlid){
obj = oItems1[j];
break;
}
}
for(var j=0;j<oItems2.length;j++){
if(oItems2[j].getAttribute('id')==xmlid){
obj = oItems2[j];
break;
}
}
if(obj){
obj.childNodes[1].text = fes[i].value;
}else{
alert("在xml中未找到id為"+xmlid+"的items或item");
}
}
}
alert(oxml.xml);
//alert(oxml.childNodes[2].xml);
return false;
}
</script>
</head>
<body>
<form name="form1" action="test.jsp" method="post" onsubmit="return btnSub();">
<script type="text/javascript">
document.write(sResult);
</script>
</form>
</body>
</html>
需要用到的輔助文件
4.focusform.css--樣式文件
5.form.js文本框的效果
6.detect.js--瀏覽器及操作系統識別(取自javascript高級程序設計)
7.xmldom.js--不同瀏覽器xml操作統一(取自javascript高級程序設計)
分享:XML 輕松學習手冊(比較不錯)XML越來越熱,關于XML的基礎教程網絡上也隨處可見。可是一大堆的概念和術語往往讓人望而生畏,很多朋友問我:XML到底有什么用,我們是否需要學習它?
相關Xml教程:
- 相關鏈接:
- 教程說明:
Xml教程-javascript xml xsl取值及數據修改(2)。