数字10怎么用徽章显示html,显示文件数量的小徽章《 HTML5：文件 API 》

下面我们再去添加一个可以显示选择的文件数量的小徽章 … (# … html)

在这个替身按钮的右边，去添加一个小徽章 … 这里我用的是 Bootstrap 的 badge 类 … 它可以让这个 标签变成小徽章的样式 … 另外还有一个 pull-right … 它可以让这个小徽章靠右显示 …

然后我们可以把选择的文件的数量作为这个 标签里面的内容 … (# fileapi.js)

在这个 displayFileInfo() 函数里面 … 添加一行代码 .. 先找到小徽章元素 …. 然后设置它的 innerHTML … 元素里面的内容 …

内容是 file 的 length 属性 …

// 显示文件数的小徽章

document.querySelector(".badge").innerHTML = file.length;

保存 … 回到浏览器 . 刷新 ..

选择文件 … 找到一些文件 … 打开 …

现在，使用 选择文件 这个替身按钮可以选择文件 … 所选的文件的数量会显示在这个小徽章里面 …