<html>
<header><title>使用 javascript 移动 xmlDom 节点.</title></header>
<body>
<textarea id='log0' rows='10' cols='100'>
<?xml version="1.0"?>
<web-app>
<welcome-file>3333index.html</welcome-file>
</web-app></textarea>
<textarea id='log1' rows='10' cols='100'>
<?xml version="1.0"?>
<web-app>
<welcome-file>1111index.html</welcome-file>
<welcome-file-list>
<welcome-file>2222index.html</welcome-file>
</welcome-file-list>
</web-app></textarea>
<br><button onclick="parse1()"> parse1 </button>
<button onclick="parse2()"> parse2 </button>
<br>
<textarea id='log2' rows='30' cols='100'></textarea>
<SCRIPT LANGUAGE=javascript>
function parse1(){
var xmlDoc0 = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc0.loadXML( document.getElementById('log0').value );
var xmlDoc1 = new ActiveXObject("Microsoft.XMLDOM");
xmlDoc1.loadXML( document.getElementById('log1').value );
if( xmlDoc0.readyState==4 && xmlDoc1.readyState==4){
rootNode0 = xmlDoc0.documentElement;
xml = '';
xml = scanXml(rootNode0, xml, 0);
document.getElementById('log2').value +=
"\n\n-------------------------------------xmlDoc0";
document.getElementById('log2').value += xml;
rootNode1 = xmlDoc1.documentElement;
moveElement(rootNode0, rootNode1);
xml = '';
xml = scanXml(rootNode1, xml, 0);
document.getElementById('log2').value +=
"\n\n-------------------------------------xmlDoc1";
document.getElementById('log2').value += xml;
xml = '';
xml = scanXml(rootNode0, xml, 0);
document.getElementById('log2').value +=
"\n\n-------------------------------------xmlDoc0";
document.getElementById('log2').value += xml;
}
}
function moveElement( sourceNode, descNode ){
while( sourceNode.hasChildNodes() ){
[b]//将会从 sourceNode 移除节点.[/b]
descNode.appendChild( sourceNode.firstChild );
}
}
function nSpace( n ){
var space ="";
for(var i=0; i< n; i++){
space += "--";
}
return space;
}
function scanXml(xmlNode, xml, level){
var currXml = '';
var currLevel = level + 1;
//alert( xmlNode.nodeType + ":" + xmlNode.nodeName );
//nodeType 此属性只读且传回一个数值。有效的数值符合以下的型别：
switch( xmlNode.nodeType ){
case 1: //-ELEMENT
currXml += "\n" + nSpace( level ) + "<" + xmlNode.nodeName + ">";
if(xmlNode.hasChildNodes()){
var nodeList = xmlNode.childNodes;
for(var i=0;i<nodeList.length;i++){
currXml = scanXml(nodeList[i], currXml, currLevel);
}
}
currXml += "\n" + nSpace( level ) + "</" + xmlNode.nodeName + ">";
break;
case 2: break;//-ATTRIBUTE
case 3: //-TEXT
currXml = "\n" + nSpace( level ) + xmlNode.nodeValue;
break;
case 4: break;//-CDATA
case 5: break;//-ENTITY REFERENCE
case 6: break;//-ENTITY
case 7: break;//-PI (processing instruction)
case 8: break;//-COMMENT
case 9: break;//-DOCUMENT
case 10: break;//-DOCUMENT TYPE
case 11: break;//-DOCUMENT FRAGMENT
case 12: break;//-NOTATION
default:
}
return xml + currXml;
}
</SCRIPT>
</body>
</html>
参照: http://www.w3sky.com/2/2550.html
分享到：
相关推荐
DOM提供了丰富的接口来处理XML文档，包括创建新节点、删除节点、复制节点、移动节点以及更新节点属性等操作。通过熟练掌握DOM，开发者可以构建动态、交互式的Web应用程序，实现对XML数据的强大控制。
XMLDOM提供了对XML节点的遍历、创建、修改和删除等操作。在JavaScript中，XMLHttpRequest对象可以用来加载XML文档，然后通过XMLDOM解析并操作XML数据，常用于数据交换和服务器通信。 **CSS** （Cascading Style ...
这篇博客"JS操作XMLDOM(遍历和打印)"很可能探讨了如何利用JavaScript来处理XML数据，特别是遍历XML结构并将其打印出来。 XML是一种结构化数据格式，常用于存储和传输数据。在JS中，XMLDOM允许我们将XML文档转换为一...
- **内存管理**：及时释放不再使用的DOM节点，防止内存泄漏。 7. **XML DOM与HTML DOM** - **共性**：XML DOM和HTML DOM在基本原理上是相同的，都遵循W3C的DOM标准。 - **差异**：HTML DOM对某些HTML特有的元素...
在JavaScript中，我们可以通过以下方式访问DOM节点： 1. `getElementById()`：通过元素的ID获取节点，这是最直接的方法。 2. `getElementsByClassName()`：返回具有特定类名的所有元素的NodeList。 3. `...
XMLDOM提供了诸如节点操作（如创建、删除和移动节点）、查找特定节点、以及设置和获取属性值等功能，使得处理XML数据变得更为方便。 这些手册将涵盖CSS的语法、选择器、布局技巧；DHTML的动态效果实现、DOM操作；...
例如，JavaScript中使用`document.implementation.createDocument()`方法或`DOMParser`对象来解析XML。 4. **访问节点**：使用DOM API，可以通过节点名称、索引或路径（如XPath）来查找特定节点。例如，`...
访问DOM节点通常通过`getElementById`、`getElementsByClassName`、`getElementsByTagName`、`querySelector`和`querySelectorAll`等方法完成。例如，`getElementById`用于获取具有特定ID的元素，而`...
7. **DOM操作**：创建新节点、插入和删除节点、复制和移动节点等，都是DOM编程中的基本操作。 8. **DOM事件委托**：利用事件冒泡或事件捕获机制，可以有效地处理大量元素的事件，提高性能。 9. **DOM性能优化**：...
JavaScript-DOM编程艺术是关于如何使用JavaScript操作网页文档对象模型（Document Object Model，简称DOM）的技术。DOM是一种标准，它提供了表示和操作HTML或XML文档的接口。通过DOM，JavaScript可以访问和修改网页...
在这个场景下，我们将关注如何利用DOM节点来实现表格内容的移动，如上下移动，以及表格的添加和删除功能。 首先，我们需要理解表格在HTML中的结构。一个基本的表格由`<table>`标签定义，其中包含`<tr>`（行）和`...
本文将详细讲解如何使用原生JavaScript操作DOM实现上下左右移动的功能。首先，我们需要了解什么是DOM，以及如何使用JavaScript来操作DOM。 DOM（Document Object Model，文档对象模型）是HTML和XML文档的编程接口。...
6. **操作（Manipulation）**：可以创建新的节点，删除已有的节点，修改节点内容，或者移动节点位置，实现对XML文档的动态修改。 7. **事件（Events）**：在JavaScript中，DOM还支持事件处理，可以绑定事件监听器，...
4. **创建和删除节点**：使用`createElement`、`appendChild`、`insertBefore`、`removeChild`等方法可以动态创建、插入、移动或删除DOM节点，实现网页的动态更新。 5. **修改节点内容**：`innerHTML`属性用于设置...
这涉及到获取和设置元素的样式属性，以及使用CSS选择器来选取特定的DOM节点。 书中还涉及了Ajax技术，即异步JavaScript和XML，用于实现无刷新的数据交换，提升用户体验。通过创建XMLHttpRequest对象，开发者可以向...
JavaScript DOM（Document Object Model）是Web开发中的一个关键概念，它允许我们通过编程方式与HTML或XML文档交互。DOM是一个树形结构，将网页内容分解为独立的对象，这些对象可以被JavaScript或者其他脚本语言访问...
2. **选择元素**：书中详细介绍了如何使用`getElementById`、`getElementsByTagName`、`getElementsByClassName`等方法以及CSS选择器来选取网页中的特定元素，这些都是JavaScript DOM编程的基础。 3. **事件处理**...
2. **DOM基础**：阐述DOM的概念，DOM树的构建，以及如何通过JavaScript获取和遍历DOM节点。 3. **事件处理**：讲解JavaScript如何响应用户的交互，如点击、鼠标移动等，以及事件冒泡和事件捕获的概念。 4. **DOM操作...
事件可以绑定到任何DOM节点上，如点击（click）、鼠标移动（mousemove）等，从而实现交互效果。 六、DOM性能优化 DOM操作往往会导致浏览器重新渲染，频繁操作可能会影响页面性能。为了优化，可以： 1. 使用文档碎片...
在JavaScript中，我们通常使用`document`对象来访问和操作DOM。 二、选择DOM元素 1. `getElementById`: 根据ID选择元素，例如：`document.getElementById('myElement')` 2. `getElementsByClassName`: 根据类名选择...