前端复习与xml

向锦

2023-12-01

前端复习与xml

获取document元素对象

1.getElementById
通过 document.getElementById('id') 方法可以获取具有 id 属性的元素，如：

<div id="elem">
    <p id="text">text</p>
</div>

<script>
    let elem = document.getElementById('text');
    elem.style.color = 'orange';
</script>

2.querySelectorAll
最常用的方法是：elem.querySelectorALL(css)，css 是一个 css 选择器：

<body>
    <div>
        <ol>
            <li>a</li>
            <li>b</li>
        </ol>
        <p>b</p>
    </div>
</body>

<script>
    let element = document.querySelectorAll('ol > li:last-child');
    element[0].style.color = 'red';
</script>

3.getElementsBy*
有以下三种方法：
getElementsByTagName(tag)：查找具有给定标签的元素；
getElementsByClassName(className)：返回具有给定 CSS类的元素；
getElementsByName(name)：返回具有 name 属性的元素，不常用。
注意：
不能漏了s
返回值为一个集合

获取element元素对象

1.getElementByID(id)
通过对元素的document.getElementByID("divid"),这是DOM一个基础的访问页面元素的方法.如：

<div id="divid">测试</div>
<script language="javascript">
var div=document.getElementByID("divid");
alert (div.nodeName); //显示元素名
</script>

如果id在元素中不是唯一的,那么获得的将是第一个ID.
2.getElementsByName(name)
仅用于input radio checkbox等元素,返回名字为name的元素数组
example:

<div name="george"></div>
<input name="george"></div>
<script language=javascript>
var ge=document.getElementsByName("george");
alert (georges.length);  //获取georges个数,对div唔效果
</script>

3.getElementsByTagName(tagname)
返回具有tagname的元素列表数组.处理大的DOM结构会用到它

xml的基本使用

html语言本身是有一些缺陷的 
（1）不能自定义标签 
（2）html本身缺少含义 
（3）html没有真正的国际化

有一个中间过渡语言,xhtml： 
html->xhtml->xml

1.XML的出现解决了程序间数据传输的问题：
比如QQ之间的数据传送，用XML格式来传送数据，具有良好的可读性，可维护性

2.XML可以做配置文件
XML文件做配置文件可以说非常普遍，比如我们的Tomcat服务器的server.xml，web.xml。再比如我们的structs中的structs-config.xml文件，和hibernate的hibernate.cfg.xml等等。

3.XML可以充当小型的数据库
XML文件可以做小型数据库，也是不错的选择，我们程序中可能用到一些经常要人工配置的数据，如果放在数据库中读取不合适（因为这会增加维护数据库的工作），则可以考虑直接用XML来做小型数据库。这种方式直接读取文件显然要比读数据库快。比如msn中保存用户聊天记录就是用XML文件。

入门案例：用XML来记录一个班级信息。

<?xml version="1.0" encoding="gb2312"?>
 
<class>
    <stu id="001">
        <name>谢鹏超</name> 
        <sex>男</sex>
        <age>20</age>
    </stu>  
    <stu id="002">
        <name>xpc</name>    
        <sex>女</sex>
        <age>21</age>
    </stu>
</class>

4.xml文件的解析
这里只是简单的提一下关于xml文件的解析，如：

package com.xinsi.qi.utils;
 
import org.dom4j.Document;
import org.dom4j.Element;
import org.dom4j.Node;
import org.dom4j.io.SAXReader;
 
import java.io.File;
import java.util.List;
 
public class Dom4jXml {
    public void test(){
        try {
            File inputFile = new File("tomcat/main/web.xml");
            SAXReader reader = new SAXReader();
            Document document = reader.read(inputFile);
            System.out.println("Root element :"+document.getRootElement().getName());
 
            Element classElement = document.getRootElement();
 
            List<Node> nodes = document.selectNodes("/class/part[@id='02']");
 
            System.out.println("--------------------");
 
            for (Node node:nodes){
                System.out.println("标签名=:"+node.getName());
                System.out.println("姓名:"+node.selectSingleNode("name").getText());
                System.out.println("年龄:"+node.selectSingleNode("age").getText());
                System.out.println("性别:"+node.selectSingleNode("sex").getText());
            }
        } catch (Exception e1) {
            e1.printStackTrace();
        }
    }
 
}

前端复习与xml