XML与web开发-01- 在页面显示和 XML DOM 解析
前言: 关于 xml 特点和基础知识,可以菜鸟教程进行学习:http://www.runoob.com/xml/xml-tutorial.html
本系列笔记,主要介绍 xml 在 web 开发时需要了解的知识
XML 在页面显示数据
XML 指可扩展标记语言(eXtensible Markup Language)。
XML 被设计用来传输和存储数据。
一、怎么在页面上只显示数据?
大家在网页上可能都见过这样的 xml 文件:
这是没有任何样式的 xml,打开 tomcat 什么的服务器,在网页上浏览 xml 文件的样式,它的源码是:
<?xml version="1.0" encoding="UTF-8" standalone="no"?><addresslist><linkman><name>肖朋伟</name><id>2236</id><company>null</company><email>xpwi@qq.com</email><tel>66666</tel></linkman>
</addresslist>
怎样在页面上只显示文字,并加上特定的样式呢?那就要用到 css 了
(1)先自己写一个 css 样式:
name{display: block;color: brown;font-size: 20pt;font-weight: bold;
}id, company, email, tel, site{display: block;color: black;font-size: 14pt;font-weight: normal;}
(2)在 xml 文件中引入这个 css 文件:
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- 加上样式,注意路径 -->
<?xml-stylesheet type="text/css" href="../css/first.css" ?><addresslist><linkman><name>肖朋伟</name><id>2236</id><company>null</company><email>xpwi@qq.com</email><tel>66666</tel></linkman>
</addresslist>
(3)就会这样显示了:
(4)然后,xml 也可以像 html 标签那样,加属性,例如:
<tel id = "userTel">66666</tel>
XML与web开发-01- xml 解析
在 xml 文件,更多的用来描述信息的内容,
所以在得到一个 XML 文档后,应该利用程序按照其中元素的定义名称取出对应内容,
这样的操作就称为 xml 解析。
W3C 定义了 SAX 和 DOM 两种解析方式
XML - DOM 解析操作
在应用程序中,基于 DOM 的 XML 分析器将一个 XML 文档转换成一个对象模型的集合,通常称为 DOM 树
应用程序正是通过对这个对象模型的操作,来实现对 XML 文档数据的操作。
准备一个 xml 文件(路径是 D:\xml\first.xml,下面要用目录,注意):
<?xml version="1.0" encoding="UTF-8" standalone="no"?><addresslist><linkman><name>肖朋伟</name><id>2236</id><company>null</company><email>xpwi@qq.com</email><tel>66666</tel></linkman>
</addresslist>
java 解析文件:
【注意】:
1.目录,我是新建一个包 xml ,再新建一个 dom.java
2.注意解析的 xml 路径,要根据自己的路径设置
3.如果自己写代码,注意一下导包,Document,是 org.w3c.dom.Document
// 目录,我是新建一个包 xml ,再新建一个 dom.java
package xml;import org.w3c.dom.NodeList;
import org.xml.sax.SAXException;//注意 Document,是 org.w3c.dom.Document
//默认导包会是 javax 那个,注意一下
import org.w3c.dom.Document;
import javax.xml.parsers.DocumentBuilder;
import javax.xml.parsers.DocumentBuilderFactory;
import javax.xml.parsers.ParserConfigurationException;
import java.io.File;
import java.io.IOException;public class dom {public static void main(String[] args){//(1)建立 DocumentBuilderFactory,用来得到 DocumentBuilderDocumentBuilderFactory factory = DocumentBuilderFactory.newInstance();//(2)通过 DocumentBuilderFactory,来得到 DocumentBuilderDocumentBuilder builder = null;try{builder = factory.newDocumentBuilder();}catch (ParserConfigurationException e){e.printStackTrace();}//(3)定义Document doc = null;try {//读取指定路径的 xml 文件,要先有一个这样的文件doc = builder.parse("D://xml/" + File.separator + "first.xml");} catch (SAXException e){e.printStackTrace();} catch (IOException e){e.printStackTrace();}//(4)查找 name 的节点NodeList nl = doc.getElementsByTagName("name");//(5)输出 NodeList 中第一个子节点中文本节点的内容System.out.println("姓名:" + nl.item(0).getFirstChild().getNodeValue());}}
运行就会在控制台打印:
DOM 解析4个核心操作接口:
- Document:此接口代表了整个 XML 文档,代表整个 DOM 树的树根,提供了对文档中的数据进行访问和操作的入口,
通过 Document 节点可以访问 XML 文件中所有的元素内容。Document 接口的常用方法如下表:
Document 接口的常用方法
No. | 方 法 | 类 型 | 描 述 |
---|---|---|---|
1 | public NodeList getElementsByTagName(String name) | 普通 | 取得指定节点名称的 NodeList |
2 | public Element createElement(String tagName)throws DOMException | 普通 | 创建一个指定名称的节点 |
3 | public Text createTextNode(String data) | 普通 | 创建一个文本内容节点 |
4 | Element createElement(String tagName)throws DOMException | 普通 | 创建一个节点元素 |
5 | public Attr createAttribute(String name)throws DOMException | 普通 | 创建一个节点元素 |
- Node:此接口在整个 DOM 树中具有剧组轻重的地位,DOM 操作的核心接口中有很大一部分是
从 Node 接口继承过来的。例如,Document、Element、Atrr 等接口
Node 接口的常用方法
No. | 方 法 | 类 型 | 描 述 |
---|---|---|---|
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
1 | Node appendChild(Node newChild)throws DOMException | 普通 | 在当前节点下增加一个新节点 |
转载于:https://www.cnblogs.com/xpwi/p/9902741.html
XML与web开发-01- 在页面显示和 XML DOM 解析相关推荐
- flask web开发是前端还是后端_Flask Web开发实战:入门、进阶与原理解析 PDF 全格式版...
给大家带来的一篇关于Flask相关的电子书资源,介绍了关于Flask.Web.开发实战方面的内容,本书是由机械工业出版社出版,格式为PDF,资源大小12.2M,李辉编写,目前豆瓣.亚马逊.当当.京东等 ...
- 《Flask Web开发实战:入门、进阶与原理解析》读书笔记
写在前面 学docker编排,有一个用Flask框架的Demo,感觉挺方便,所以学习下 基于<Flask Web开发实战:入门.进阶与原理解析>做的读书笔记 个人还是比较喜欢看书,看书的话 ...
- web开发中前端页面是如何跟后端服务器数据交互的
后端服务器一般是指servlet容器,用于执行java源程序 常见的网页有html,htm,shtml,asp,aspx,php,jsp等格式 前两个常用于静态网页,后面几个常用于动态网页. 这里前端 ...
- python +Django 搭建web开发环境初步,显示当前时间
1.python 的安装 网上很多关于django跟python 开发的资料,这块我正在实习准备用这个两个合起来搞一个基于web 的东西出来现在开始学习,写点东西记录一下心得. 开发环境是window ...
- QT Creator应用程序开发——01简单按钮显示
目录 前言 一.新建项目 二.设计ui页面和编写程序 (一)设计ui页面 1.设置按钮 2.设置标签 3.设置转到槽 (二)编写程序 (三)构建运行 (三)测试 结语 前言 本系列文章,是经博主的QT ...
- WEB开发中的页面跳转方法总结
1.PHP header()调转 <?php //302跳转 $url = "http://www.baidu.com/"; header("Location: $ ...
- C# WINFORM中的combobox.items.add实现像web开发那样,添加显示内容text和实际value值
摘自msdn,详见http://social.msdn.microsoft.com/Forums/en-US/winforms/thread/c7a82a6a-763e-424b-84e0-496ca ...
- Web开发基础-新闻页面-老九门
代码部分: <html><head><title>老九门</title></head><body><h1><老 ...
- Flask Web开发实战(入门、进阶与原理解析)
URL重定向 错误响应 > 如果你想手动返回错误响应,可以使用Flask提供的abort()函数. XML 上下文全局变量 [](https://img2018.cnblogs.com/blog ...
最新文章
- django学习教程
- 更换yum的源为阿里云或者网易
- 使用WinPcap和libpcap类库读写pcap文件(001)开发环境配置
- Shell多线程操作及线程数控制实例
- 语音交互编程语言了解一下?
- PHP array_count_values() 函数用于统计数组中所有值出现的次数。
- MTFlexbox自动化埋点探索
- xjc java_xjc命令转换成java类乱码
- 给下拉框加上可输入查询特性,包括中文与拼音首字母
- idea 代码编译打包不报错,但是代码显示报错
- vxworks linux 多线程api,vxWorks操作系统的多线程实现研究
- LaTeX(6)——LaTeX引用使用(\label)
- JS打开新窗口并居中显示
- 汇编语言指令大全(详细)
- 常用计算机故障的判断方法有哪些,常用汽车故障基本诊断方法
- android eclipse三合一,创新巅峰之作全能型Orbitrap Eclipse三合一质谱仪
- vue axio的使用
- 阿里云MaxCompute 2019-7月刊
- 使用transition实现图片轮播效果
- 赛码行测题库_京东财务人员面试经验|面试题 - 职朋职业圈