HTML、XML和JSON学习汇总

时间：2018-06-29 23:35:54 阅读：291 评论：0 收藏：0 [点我收藏+]

　　写在前面：楼主也是刚刚接触这方面的知识，之前完全是零基础，后来经朋友推荐了几个不错的博文，看完以后豁然开朗。但是此博文更加偏重于基础知识介绍（其实更深的楼主也还不了解，这方面的大神请绕道），只是分享个人的一个学习总结。希望那些跟我一样，在实验室闷头搞科研，一出门实习完全一头雾水的同僚们可以借鉴：好多东西并没有我们想想的那么复杂，只要你肯学，迈出第一步，你就成功了一大半。与大家共勉！

　　好了，想花时间接着往下看的博友们，我们可以步入正题了。

回到顶部

1. HTML语言

　　首先，先简单的提及一下超文本标记语言HTML(HyperText Markup Language)。对于HTML语言，大家一定不陌生，没吃过猪肉，可总见过猪跑吧。

　　简单来说，超文本标记语言HTML是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。“标记”是指计算机所能理解的信息符号，通过此种标记，计算机之间可以处理包含各种信息的文章等。有关HTML的具体细节就不具体介绍了，只要记住以下三点就可以了：

网页的本质就是超级文本标记语言，通过结合使用其他的Web技术（如：脚本语言、公共网关接口、组件等），可以创造出功能强大的网页。因而，超级文本标记语言是万维网（Web）编程的基础，也就是说万维网是建立在超文本基础之上的。万维网盛行的原因，很大程度上都要归功于HTML。
超文本标记语言的结构包括“头”部分（Head）、和“主体”部分（Body），其中“头”部提供关于网页的信息，“主体”部分提供网页的具体内容。
HTML被设计的目的是用来实现数据。

回到顶部

2. XML语言

　　扩展标记语言 XML(Extensible Markup Language) 的规范定义：用于标记电子文件使其具有结构性的标记语言，可以用来标记数据、定义数据类型，是一种允许用户对自己的标记语言进行定义的源语言。 XML使用DTD(document type definition)文档类型定义来组织数据;格式统一，跨平台和语言，早已成为业界公认的标准。XML是标准通用标记语言 (SGML) 的子集，非常适合 Web 传输。XML 提供统一的方法来描述和交换独立于应用程序或供应商的结构化数据。

　　简单说，XML就是一种数据的描述语言，虽然它是语言，但是通常情况下，它并不具备常见语言的基本功能——被计算机识别并运行。只有依靠另一种语言，来解释它，使它达到你想要的效果或被计算机所接受。XML是独立于软件和硬件的信息传输工具。目前，XML在Web中起到的作用不会亚于一直作为 Web 基石的 HTML，XML无所不在。XML是各种应用程序之间进行数据传输的最常用的工具，并且在信息存储和描述领域变得越来越流行。

回到顶部

2.1 XML的特点

　　关于XML，记住以下几点就行了：

XML是一种标记语言，很类似HTML
XML的设计宗旨是传输数据，而非显示数据
XML标签没有被预定义。您需要自行定义标签。
XML被设计为具有自我描述性。
XML是W3C的推荐标准

回到顶部

2.2 XML与HTML的主要差异：

XML不是HTML的替代。
XML和HTML为不同的目的而设计：XML被设计为传输和存储数据，其焦点是数据的内容；HTML被设计用来显示数据，其焦点是数据的外观。
HTML旨在显示信息，而 XML 旨在传输信息。
XML是一种重量级的数据交换格式语言（详细的解释会在JSON的介绍中提及）。

　　误区：XML不是用来取代HTML的，它是HTML的补充。

回到顶部

2.3 XML允许自定义标签

　　XML被设计用来结构化、存储以及传输信息，它没有预定义的标签。在HTML中使用的标签（以及HTML的结构）是预定义的。HTML文档只使用在HTML标准中定义过的标签（比如<p>，<h1> 等等）。XML允许创作者定义自己的标签和自己的文档结构。

　　举个简单的例子，比如John写给George的便签，存储为XML：

<note>
<to>George</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don‘t forget the meeting!</body>
</note>

　　上面的这条便签具有自我描述性。它拥有标题以及留言，同时包含了发送者和接受者的信息。但是，这个 XML 文档仍然没有做任何事情。它仅仅是包装在XML标签中的纯粹的信息。我们需要编写软件或者程序，才能传送、接收和显示出这个文档。

回到顶部

2.4 XML的解析

　　XML目前设计了两种解析方式：DOM和 SAX。　　

　　1）DOM：把一个数据交换格式XML看成一个DOM对象，需要把XML文件整个读入内存。

　　2）SAX：不需要整个读入文档就可以对解析出的内容进行处理，是一种逐步解析的方法。程序也可以随时终止解析。这样，一个大的文档就可以逐步的、一点一点的展现出来，所以SAX适合于大规模的解析。

　　有关XML的详细的语法和解析介绍，可以转至下面的链接：

　　10分钟掌握XML、JSON及其解析

回到顶部

3. JSON语言

　　JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。它基于JavaScript的一个子集。 JSON采用完全独立于语言的文本格式，但是也使用了类似于C语言家族的习惯（包括C, C++, C#, Java, JavaScript, Perl, Python等）。这些特性使JSON成为理想的数据交换语言。易于人阅读和编写，同时也易于机器解析和生成。

回到顶部

3.1 JSON的语法规则

　　JSON 语法是 JavaScript 对象表示语法的子集。

数据在名称/值对中
数据由逗号分隔
花括号保存对象
方括号保存数组

　　1）JSON 数据的书写格式是：名称/值对。

　　名称/值对组合中的名称写在前面（在双引号中），值对写在后面(同样在双引号中)，中间用冒号隔开：

“Name” ： “Poll”

　　这很容易理解，等价于这条 JavaScript 语句：

Name=“Poll”

　　2）JSON 值可以是：

数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true 或 false）
数组（在方括号中）
对象（在花括号中）
null

　　3）JSON有两种数据结构：

对象：对象在js中表示为“{}”括起来的内容，数据结构为 {key：value,key：value,...}的键值对的结构，在面向对象的语言中，key为对象的属性，value为对应的属性值，所以很容易理解，取值方法为对象.key 获取属性值，这个属性值的类型可以是数字、字符串、数组、对象几种。

数组：数组在js中是中括号“[]”括起来的内容，数据结构为 ["java","javascript","vb",...]，取值方式和所有语言中一样，使用索引获取，字段值的类型可以是数字、字符串、数组、对象几种。

　　经过对象、数组两种结构就可以组合成复杂的数据结构了。

　　JSON的一个简单的例子：

{
"people": [
                { "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
                { "firstName": "Jason", "lastName":"Hunter", "email": "bbbb"},
                { "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
            ]
}

　　当然，你还可以表示的更复杂一些，例如这样：

{ "programmers": [
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" },
{ "firstName": "Jason", "lastName":"Hunter", "email": "bbbb" },
{ "firstName": "Elliotte", "lastName":"Harold", "email": "cccc" }
],
"authors": [
{ "firstName": "Isaac", "lastName": "Asimov", "genre": "science fiction" },
{ "firstName": "Tad", "lastName": "Williams", "genre": "fantasy" },
{ "firstName": "Frank", "lastName": "Peretti", "genre": "christian fiction" }
],
"musicians": [
{ "firstName": "Eric", "lastName": "Clapton", "instrument": "guitar" },
{ "firstName": "Sergei", "lastName": "Rachmaninoff", "instrument": "piano" }
] }

　　这里最值得注意的是，能够表示多个值，每个值进而包含多个值。但是还应该注意，在不同的主条目（programmers、authors 和 musicians）之间，记录中实际的名称 / 值对可以不一样。JSON 是完全动态的，允许在 JSON 结构的中间改变表示数据的方式。在处理 JSON 格式的数据时，没有需要遵守的预定义的约束。所以，在同样的数据结构中，可以改变表示数据的方式，甚至可以以不同方式表示同一事物。

　　看到这里，大家一定觉得JSON很容易理解吧。为大家提供一个小工具：JSON在线校验格式化工具bejson，可以自己尝试着在这里编写一写简单的JSON。

回到顶部

3.2 如何使用JSON？

　　讲了这么多，大家一定想知道如何来使用JSON，JSON最常用的两种使用方法分别是JavaScrip（JS）和.Net，详细地细则请转至下面的博客：

　　JSON详解

　　当然也可以使用其他途径来读取和使用JSON，例如Python等，这个需要我们共同的去学习。

回到顶部

3.3 XML和JSON对比

　　引用网友的一句话，“JSON和XML就像武林界的屠龙刀和倚天剑，那么他们孰强孰弱？” 那么大家一定也很想知道，谁才是武林的霸主？下面我们就一起将他们进行一下PK吧。

　　(1).可读性方面：JSON和XML的数据可读性基本相同，JSON和XML的可读性可谓不相上下，一边是建议的语法，一边是规范的标签形式，XML可读性较好些。　

　　(2).可扩展性方面：XML天生有很好的扩展性，JSON当然也有，没有什么是XML能扩展，JSON不能的。

　　(3).编码难度方面：XML有丰富的编码工具，比如Dom4j、JDom等，JSON也有json.org提供的工具，但是JSON的编码明显比XML容易许多，即使不借助工具也能写出JSON的代码，可是要写好XML就不太容易了。

　　(4).解码难度方面：XML的解析得考虑子节点父节点，让人头昏眼花，而JSON的解析难度几乎为0。这一点XML输的真是没话说。

　　(5).流行度方面：XML已经被业界广泛的使用，而JSON才刚刚开始，但是在Ajax这个特定的领域，未来的发展一定是XML让位于JSON。到时Ajax应该变成Ajaj(Asynchronous Javascript and JSON)了。

　　(6).解析手段方面：JSON和XML同样拥有丰富的解析手段。

　　(7).数据体积方面：JSON相对于XML来讲，数据的体积小，传递的速度更快些。

　　(8).数据交互方面：JSON与JavaScript的交互更加方便，更容易解析处理，更好的数据交互。

　　(9).数据描述方面：SON对数据的描述性比XML较差。

　　(10).传输速度方面：JSON的速度要远远快于XML。

　　为了突出展示一下两者的对比，举一个经典的例子：

　　用XML表示中国部分省市数据如下：

<?xml version="1.0" encoding="utf-8"?>
<country>
    <name>中国</name>
    <province>
        <name>黑龙江</name>
        <cities>
            <city>哈尔滨</city>
            <city>大庆</city>
        </cities>
    </province>
    <province>
        <name>广东</name>
        <cities>
            <city>广州</city>
            <city>深圳</city>
            <city>珠海</city>
        </cities>
    </province>
    <province>
        <name>台湾</name>
        <cities>
            <city>台北</city>
            <city>高雄</city>
        </cities>
    </province>
    <province>
        <name>新疆</name>
        <cities>
            <city>乌鲁木齐</city>
        </cities>
    </province>
</country>

　　用JSON表示：

{
    "name":"中国",
    "province":[
    {
       "name":"黑龙江",
        "cities":{
            "city":["哈尔滨","大庆"]
        }
     },
     {
        "name":"广东",
        "cities":{
            "city":["广州","深圳","珠海"]
        }
    },
    {
        "name":"台湾",
        "cities":{
            "city":["台北","高雄"]
        }
    },
    {
        "name":"新疆",
        "cities":{
            "city":["乌鲁木齐"]
        }
    }
]
}

　　讲了这么多，大家也肯定是凌乱了，不光是你们，就是我也记不住这么多的内容。其实，总结一点就是：XML更像是数据传输界的长老，相对于JSON而言是一种重量型的数据交换格式；而JSON就是后起之秀，是一种轻量型的数据交换格式，两个各有优缺点，孰轻孰重还要看具体的应用环境。

　　最后，向大家推荐两个相关的博客：

　　1）JSON资料整理

　　2）JSON与XML的区别比较

HTML、XML和JSON学习汇总

标签：apt javascrip pre 标记条目并且 code ict 就是

原文地址：https://www.cnblogs.com/nihaizong/p/9245720.html

踩

(0)