. 概述

FormData类型其实是在XMLHttpRequest 2级定义的，它是为序列化表以及创建与表单格式相同的数据（当然是用于XHR传输）提供便利。

2. 构造函数

创建一个formData对象实例有几种方式

1、创建一个空对象实例

var formData = new FormData();

此时可以调用append()方法来添加数据

2、使用已有的表单来初始化一个对象实例

假如现在页面已经有一个表单

<form id="myForm" action="" method="post">
    <input type="text" name="name">名字
    <input type="password" name="psw">密码
    <input type="submit" value="提交">
</form>

我们可以使用这个表单元素作为初始化参数，来实例化一个formData对象

// 获取页面已有的一个form表单
var form = document.getElementById("myForm");
// 用表单来初始化
var formData = new FormData(form);
// 我们可以根据name来访问表单中的字段
var name = formData.get("name"); // 获取名字
var psw = formData.get("psw"); // 获取密码
// 当然也可以在此基础上，添加其他数据
formData.append("token","kshdfiwi3rh");

3. 操作方法

首先，我们要明确formData里面存储的数据形式，一对key/value组成一条数据，key是唯一的，一个key可能对应多个value。如果是使用表单初始化，每一个表单字段对应一条数据，它们的HTML name属性即为key值，它们value属性对应value值。

3.1 获取值

我们可以通过get(key)/getAll(key)来获取对应的value，

formData.get("name"); // 获取key为name的第一个值
formData.get("name"); // 返回一个数组，获取key为name的所有值

3.2 添加数据

我们可以通过append(key, value)来添加数据，如果指定的key不存在则会新增一条数据，如果key存在，则添加到数据的末尾

formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k1", "v1");

formData.get("k1"); // "v1"
formData.getAll("k1"); // ["v1","v2","v1"]

3.3 设置修改数据

我们可以通过set(key, value)来设置修改数据，如果指定的key不存在则会新增一条，如果存在，则会修改对应的value值。

formData.append("k1", "v1");
formData.set("k1", "1");
formData.getAll("k1"); // ["1"]

3.4 判断是否该数据

我们可以通过has(key)来判断是否对应的key值

formData.append("k1", "v1");
formData.append("k2",null);

formData.has("k1"); // true
formData.has("k2"); // true
formData.has("k3"); // false

3.5 删除数据

通过delete(key)，来删除数据

formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k1", "v1");
formData.delete("k1");

formData.getAll("k1"); // []

3.6 遍历

我们可以通过entries()来获取一个迭代器，然后遍历所有的数据，

formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k2", "v1");

var i = formData.entries();

i.next(); // {done:false, value:["k1", "v1"]}
i.next(); // {done:fase, value:["k1", "v2"]}
i.next(); // {done:fase, value:["k2", "v1"]}
i.next(); // {done:true, value:undefined}

可以看到返回迭代器的规则

1. 每调用一次next()返回一条数据，数据的顺序由添加的顺序决定
2. 返回的是一个对象，当其done属性为true时，说明已经遍历完所有的数据，这个也可以作为判断的依据
3. 返回的对象的value属性以数组形式存储了一对key/value，数组下标0为key，下标1为value，如果一个key值对应多个value，会变成多对key/value返回

我们也可以通过values()方法只获取value值

formData.append("k1", "v1");
formData.append("k1", "v2");
formData.append("k2", "v1");

var i = formData.entries();

i.next(); // {done:false, value:"v1"}
i.next(); // {done:fase, value:"v2"}
i.next(); // {done:fase, value:"v1"}
i.next(); // {done:true, value:undefined}

4. 发送数据

我们可以通过xhr来发送数据

var xhr = new XMLHttpRequest();
xhr.open("post","login");
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
xhr.send(formData);

这种方式可以来实现文件的异步上传。

5. 其他

浏览器兼容性查询：https://caniuse.com/#search=formdata

英文文档：https://developer.mozilla.org/en-US/docs/Web/API/FormData

转自：https://segmentfault.com/a/1190000006716454

本Pandas教程中，我们将详细介绍如何使用Pandas read_html方法从HTML中获取数据。首先，在最简单的示例中，我们将使用Pandas从一个字符串读取HTML。其次，我们将通过几个示例来使用Pandas read_html从Wikipedia表格中获取数据。在之前的一篇文章(关于Python中的探索性数据分析)中，我们也使用了Pandas从HTML表格中读取数据。

在Python中导入数据

在开始学习Python和Pandas时，为了进行数据分析和可视化，我们通常从实践导入数据开始。在之前的文章中，我们已经了解到我们可以直接在Python中输入值(例如，从Python字典创建Pandas dataframe)。然而,通过从可用的源导入数据来获取数据当然更为常见。这通常是通过从CSV文件或Excel文件中读取数据来完成的。例如，要从一个.csv文件导入数据，我们可以使用Pandas read_csv方法。这里有一个如何使用该方法的快速的例子，但一定要查看有关该主题的博客文章以获得更多信息。

现在，上面的方法只有在我们已经有了合适格式的数据(如csv或JSON)时才有用(请参阅关于如何使用Python和Pandas解析JSON文件的文章)。

我们大多数人会使用Wikipedia来了解我们感兴趣的主题信息。此外，这些Wikipedia文章通常包含HTML表格。

要使用pandas在Python中获得这些表格，我们可以将其剪切并粘贴到一个电子表单中，然后，例如使用read_excel将它们读入Python。现在，这个任务当然可以用更少的步骤来完成:我们可以通过web抓取来对它进行自动化。一定要查看一下什么是web抓取。

先决条件

当然，这个Pandas读取HTML教程将要求我们安装Pandas及其依赖项。例如，我们可以使用pip来安装Python包，比如Pandas，或者安装一个Python发行版(例如，Anaconda、ActivePython)。下面是如何使用pip安装Pandas: pip install pandas。

注意，如果出现消息说有一个更新版本的pip可用，请查看这篇有关如何升级pip的文章。注意，我们还需要安装lxml或BeautifulSoup4，当然，这些包也可以使用pip来安装: pip install lxml。

Pandas read_html 语法

下面是如何使用Pandas read_html从HTML表格中抓取数据的最简单的语法:

现在我们已经知道了使用Pandas读取HTML表格的简单语法，接下来我们可以查看一些read_html示例。

Pandas read_html 示例1:

第一个示例是关于如何使用Pandas read_html方法的，我们将从一个字符串读取HTML表格。

现在，我们得到的结果不是一个Pandas DataFrame，而是一个Python列表。也就是说，如果我们使用type函数，我们可以看到:

如果我们想得到该表格，我们可以使用列表的第一个索引(0)

Pandas read_html 示例 2:

在第二个Pandas read_html示例中，我们将从Wikipedia抓取数据。实际上，我们将得到蟒科蛇(也称为蟒蛇)的HTML表格。

现在，我们得到了一个包含7个表(len(df))的列表。如果我们去Wikipedia页面，我们可以看到第一个表是右边的那个。然而，在本例中，我们可能对第二个表更感兴趣。

Pandas read_html 示例 3:

在第三个示例中，我们将从瑞典的covid-19病例中读取HTML表。这里，我们将使用read_html方法的一些附加参数。具体来说，我们将使用match参数。在此之后，我们还需要清洗数据，最后，我们将进行一些简单的数据可视化操作。

使用Pandas read_html和匹配参数抓取数据：

如上图所示，该表格的标题为:“瑞典各郡新增COVID-19病例”。现在，我们可以使用match参数并将其作为一个字符串输入：

通过这种方式，我们只得到这个表，但它仍然是一个dataframes列表。现在，如上图所示，在底部，我们有三个需要删除的行。因此，我们要删除最后三行。

使用Pandas iloc删除最后的行

现在，我们将使用Pandas iloc删除最后3行。注意，我们使用-3作为第二个参数(请确保你查看了这个Panda iloc教程，以获得更多信息)。最后，我们还创建了这个dataframe的一个副本。

在下一节中，我们将学习如何将多索引列名更改为单个索引。

将多索引更改为单个索引并删除不需要的字符

现在，我们要去掉多索引列。也就是说，我们将把2列索引(名称)变成唯一的列名。这里，我们将使用DataFrame.columns 和 DataFrame.columns,get_level_values:

最后，正如你在“date”列中所看到的，我们使用Pandas read_html从WikiPedia表格抓取了一些注释。接下来，我们将使用str.replace方法和一个正则表达式来删除它们:

使用Pandas set_index更改索引

现在，我们继续使用Pandas set_index将日期列变成索引。这样一来，我们稍后就可以很容易地创建一个时间序列图。

现在，为了能够绘制这个时间序列图，我们需要用0填充缺失的值，并将这些列的数据类型更改为numeric。这里我们也使用了apply方法。最后，我们使用cumsum方法来获得列中每个新值累加后的值:

来自HTML表格的时间序列图

在最后一个示例中，我们使用Pandas read_html获取我们抓取的数据，并创建了一个时间序列图。现在，我们还导入了matplotlib，这样我们就可以改变Pandas图例的标题的位置:

结论: 如何将HTML读取到一个 Pandas DataFrame

在这个Pandas教程中，我们学习了如何使用Pandas read_html方法从HTML中抓取数据。此外，我们使用来自一篇Wikipedia文章的数据来创建了一个时间序列图。最后，我们也可以通过参数index_col来使用Pandas read_html将' Date '列设置为索引列。

英文原文：https://www.marsja.se/how-to-use-pandas-read_html-to-scrape-data-from-html-tables
译者：一瞬

avaScript中的数据类型分为两大类，分别是基本数据类型和复杂数据类型(或称为引用数据类型)，如图所示。

本节重点讲解基本数据类型。下面我们用代码演示基本数据类型的使用。

(1)数字型(Number)，包含整型值和浮点型值:

var numl = 21;                          //整型值 
var num2 = 0.21;                         //浮点型值

(2)布尔型(Boolean)，包含 true 和false 两个布尔值 :

var booll = true;                  //表示真、1、成立
var bool2 = false;                 // 表示假、0、不成立

(3)字符串型(String)，用单引号或双引号包裹:

var strl = '';                    //空字符串
var str2 = 'abc';                 //单引号包裹的字符串 abc
var str3 = "abc";                 //双引号包裹的字符串 abc

(4)未定义型(Undefined)，只有一个值 undefined :

var a;                           // 声明变量 a，未赋值，此时 a就是undefined
var b = undefined;               //变量b的值为 undefined

(5)定型(Null)，只有一个值null:

var a = null;                   //变量a的值为nu11

需要注意的是，代码中的值 tue、false、undefined和null全部都要写成小写字母。