• 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:xmlfirst.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,用来得到 DocumentBuilder
            DocumentBuilderFactory factory = DocumentBuilderFactory.newInstance();
    
            //(2)通过 DocumentBuilderFactory,来得到 DocumentBuilder
            DocumentBuilder 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 普通 在当前节点下增加一个新节点
  • 相关阅读:
    三级联动
    投票系统
    增删改查
    PHP基础
    查询练习
    高级查询
    高级查询练习题
    0510课堂02三元运算符,跳转语句,循环结构
    0510课堂
    050602课堂css3旋转、过渡、动画
  • 原文地址:https://www.cnblogs.com/xpwi/p/9902741.html
Copyright © 2020-2023  润新知