`
- 浏览:
3689 次
- 性别:
- 来自:
无锡
-
这次准备使用JS来读取XML做一个例子来熟悉下,一共使用了一下几个技术:Json,array排序,读取xml,下面我就贴出代码:
第一部:我们需要学习如何判断浏览器的类型:
下面是几个主流的浏览器使用js的判断方法
function getOs()
{
var OsObject = "";
if(navigator.userAgent.indexOf("MSIE")>0) {
return "MSIE";
}
if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){
return "Firefox";
}
if(isSafari=navigator.userAgent.indexOf("Safari")>0) {
return "Safari";
}
if(isCamino=navigator.userAgent.indexOf("Camino")>0){
return "Camino";
}
if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){
return "Gecko";
}
}
通过以上方法,大家可以取出浏览器的类型,根据浏览器的不同类型,我们使用不同的方式来实例化对象:
下面就是我写的所有代码,大家可以参考下:
<!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>
<title>JS读取XMLDemo</title>
<script language="javascript" type="text/javascript">
function NewInfoAction()
{
var dom;
var type=1; //默认为IE浏览器
var data = new Array(); //存储实体的数组
if(navigator.userAgent.indexOf("MSIE")>0)
{
dom = new ActiveXObject("Microsoft.XMLDOM"); //实例化dom对象
/*
这个地方很多朋友不明白,我写详细点
设置异步处理
本函数不需要在XML文件读取完成之前进行任何操作,
因此关闭异步处理功能。
*/
dom.async = false;
dom.load("NewInfo.xml"); //加载xml文件
window.alert('IE');
}
else if(isFirefox=navigator.userAgent.indexOf("Firefox") > 0)
{
type=2;
dom = document.implementation.createDocument("", "", null); //火狐不支持ActiveXObject
dom.async = false;
dom.load("NewInfo.xml");
/*
这是火狐的另外一中加载xml的方式
var oXmlHttp = new XMLHttpRequest() ;
oXmlHttp.open( "GET", "test.xml", false ) ;
oXmlHttp.send(null) ;
//oXmlHttp.responseXML就是xml对象了。
*/
}
else
{
window.alert('暂不识别该浏览器!');
return;
}
if(dom)
{
var node;
if(type == 1) //判断是否为IE浏览器
{
node = dom.documentElement.childNodes; //这里的node大家可以理解为net中的表,方便大家理解
for(var i=0;i<node.length;i++)
{
var title = node[i].childNodes[0].text; //取出i行中的字段的值,大家这样理解更方便
var content = node[i].childNodes[1].text;
var date = node[i].childNodes[2].text;
data.push({title:title,content:content,date:date}); //在这里,我们使用使用json,把数据库存储在里面
}
}
else
{
var node = dom.getElementsByTagName("News");
for(var i=0;i<node.length;i++)
{
// window.alert(dom.getElementsByTagName("News")[i].childNodes[1].textContent);
// window.alert(dom.getElementsByTagName("News")[i].childNodes[3].textContent);
// window.alert(dom.getElementsByTagName("News")[i].childNodes[5].textContent);
var value = dom.getElementsByTagName("News")[i].textContent.split(' ');
var title = value[4];
var content = value[8];
var date = value[12];
data.push({title:title,content:content,date:date}); //在这里,我们使用使用json,把数据库存储在里面
}
}
}
else
{
window.alert("dom对象为空,失败了!");
return;
}
if(data.length != 0)
{
var shtml = '';
for(var i=0;i<data.length;i++)
{
shtml += '<div>';
shtml += '<div style="float:left; background-color:Red; width:80px; height:15px">';
shtml += data[i].title;
shtml += '</div>';
shtml += '<div>';
shtml += '<div style="float:left; background-color:Green;width:150px; height:15px">';
shtml += data[i].content;
shtml += '</div>';
shtml += '<div style="float:left; background-color:Green;width:120px; height:15px">';
shtml += data[i].date;
shtml += '</div>';
shtml += '</div>';
shtml += '</div>';
shtml += '<br/>';
}
document.getElementById('textDiv').innerHTML = shtml;
}
else
{
document.getElementById('textDiv').innerHTML = '没有信息!';
}
}
</script>
</head>
<body onload="NewInfoAction()">
<div id="textDiv" >
</div>
</body>
</html>
一下是xml的文件格式:
<?xml version="1.0" encoding="utf-8" ?>
<NewInfo>
<News>
<Title>今天要下雨</Title>
<Content>今天确实下雨了</Content>
<Date>2009-02-04</Date>
</News>
<News>
<Title>今天出太阳</Title>
<Content>今天确实出太阳了</Content>
<Date>2009-02-03</Date>
</News>
<News>
<Title>今天很无聊</Title>
<Content>今天确实很无聊</Content>
<Date>2009-02-02</Date>
</News>
</NewInfo>
分享到:
Global site tag (gtag.js) - Google Analytics
相关推荐
本文将详细介绍如何使用JavaScript读取XML文件以及如何获取文件中的特定内容。 #### JavaScript与XML交互基础 1. **创建XMLHttpRequest对象**: - 首先,需要创建一个`XMLHttpRequest`对象来发送HTTP请求。这个...
js 操作xml 文件 读取xml文件 js 操作xml 文件 读取xml文件
### JavaScript读取XML文件的方法详解 #### 一、引言 在现代Web开发中,XML(可扩展标记语言)作为一种轻量级的数据交换格式,在早期的Web应用中扮演着重要的角色。JavaScript作为前端的主要编程语言之一,具备强大...
以上就是JavaScript读取XML文件的基本步骤。需要注意的是,由于同源策略的限制,JavaScript只能直接从同一源加载XML文件。如果XML文件位于其他域,可能需要服务器端的帮助,如使用CORS(跨源资源共享)配置允许跨域...
总的来说,通过JavaScript读取XML文件需要异步加载XML数据,然后使用DOM解析XML字符串。在实际项目中,还可以考虑使用jQuery、axios等库来简化XML处理。同时,理解XML和DOM的概念对于JavaScript开发者来说是非常重要...
结合以上步骤,一个简单的JavaScript读取XML文件的示例代码如下: ```html <!DOCTYPE html> <title>JavaScript读取XML示例 var xhr = new XMLHttpRequest(); xhr.open('GET', 'yourfile.xml', true); ...
本篇文章将深入探讨如何使用JS来读取XML字符串,并构建一个树形表示。 首先,我们需要理解XML(Extensible Markup Language)的基本概念。XML是一种标记语言,用于存储和传输结构化数据。它的结构类似于HTML,但更...
JavaScript(JS)是一种广泛用于网页和网络应用的脚本语言,...总的来说,JS滑动门读取XML并分页是一项结合了前端交互、数据处理和用户界面设计的技术。通过理解这些概念和技巧,开发者能够创建出动态且易用的Web应用。
通过以上分析可以看出,这段代码的主要功能是使用JavaScript读取XML文档,并将其中的数据转换成HTML格式展示在网页上。这种方式非常适合用于构建动态的、数据驱动的用户界面。需要注意的是,该示例代码仅适用于支持`...
总结,JavaScript读取XML主要依赖XMLDOM和DOM API,或者利用jQuery等库简化操作。理解这些概念和技术,能帮助开发者有效地处理XML数据,实现数据的动态加载和展示。在实际项目中,结合JSON使用可以提高效率和便利性...
这个"JS读取XML例子(兼容IE和FF).rar"压缩包包含了一个示例,展示了如何在不依赖任何插件的情况下,使用JavaScript在Internet Explorer(IE)和Firefox(FF)等浏览器中读取XML文件。下面我们将详细探讨JavaScript...
在JavaScript中,读取XML...以上就是使用JavaScript读取XML文件并生成树形结构的基本步骤。实际应用中,可能还需要考虑错误处理、优化性能以及更复杂的树结构显示。了解这些基本原理后,你可以根据需求进行扩展和定制。
这个场景下,我们关注的重点是如何在不依赖用户权限提示的情况下,使用JS在Internet Explorer(IE)和Firefox这两个浏览器中读取XML文件。本文将详细介绍实现这一功能的技术要点。 首先,我们需要了解...
在IT行业中,Asp(Active Server Pages)是一种微软开发的服务器端脚本环境,用于创建动态交互式网页。...但是,对于需要与旧系统集成或者有特定需求的项目,Asp+JavaScript读取远程XML文件仍然是一种可行的技术方案。
### JavaScript读取XML文件知识点详解 #### 一、XML与JavaScript简介 - **XML (Extensible Markup Language)**:一种标记语言,类似于HTML,用于存储和传输数据。它被设计成具有自描述性,使得数据在不同系统间...
本篇文章将深入探讨如何使用jQuery来读取XML,并通过实例详细解析相关知识点。 一、jQuery.parseXML()函数 在jQuery中,首先我们需要将XML字符串转换为XML DOM对象。这可以通过使用`jQuery.parseXML()`函数来实现...
总的来说,通过JavaScript读取XML并生成DTree,我们可以创建一个交互式的、直观的配置文件目录结构,简化用户的操作。这个过程包括加载XML文件、解析XML为树形结构、以及将树形结构转化为可视化的HTML元素。理解这些...
### JS读取XML知识点详解 #### 一、XML与JavaScript结合的重要性 XML(eXtensible Markup Language)是一种用于标记数据的语言,具有良好的结构化特性,适用于存储和传输数据。在Web开发中,XML常被用作数据交换...
1. **读取XML** - 使用`DOMParser`:JavaScript提供了一个内置对象`DOMParser`,可以将XML字符串解析为DOM(Document Object Model)树。例如: ```javascript var parser = new DOMParser(); var xml = parser....
总结来说,JavaScript读取XML的基本流程包括: 1. 创建或获取XML文档对象,例如通过`new ActiveXObject("Microsoft.XMLDOM")`(在旧版IE中)或`new DOMParser().parseFromString(xmlString, "text/xml")`(在现代...