jQuery：查找文件大小并将其添加到链接中答案

【问题标题】：jQuery: Finding file size and adding it to the linkjQuery：查找文件大小并将其添加到链接中
【发布时间】：2013-06-24 16:08:20
【问题描述】：

首先让我说我无论如何都不是 jQuery 大师，我真的知道这已经超出了我的想象，这就是我来到 SO 的原因。

有没有办法使用 jQuery 来查找页面上链接的文件大小，然后在链接旁边注入/添加文件大小的文本？

这是我的问题

在我的一个页面上，我有一个指向我的简历的链接，它是一个 PDF 文件，并且为了提高可用性，下面有 文件类型 和 文件大小 是合适的到链接，以便用户可以选择是否要单击该链接。所以链接的内容类似于"Download my resume (PDF / 80KB)"

问题是我不断更新我的简历并上传一个新的 PDF 文件，当然，它具有不同的文件大小，所以我总是回到 HTML 并更改文本以反映新的文件大小.

有没有办法使用 jQuery... 或纯 JavaScript 来自动执行此操作？

我找到了this script 并创建了一个demo here in Codepen，但它似乎不起作用。

对此的任何帮助将不胜感激。

【问题讨论】：

标签： jquery

【解决方案1】：

你写了（两次）

json.headers['Content-Length']

当属性的名称（你可以在响应的正文中看到）实际上是小写时：

json.headers['content-length']

如果你更正这个键，输出是(pdf 101.6 KB)

另外请注意，如果您的 CV 和下载页面在同一个域中，您可以简单地使用 HEAD ajax 请求并读取 content-length 响应标头

【讨论】：

这很棒 Fabrizio!。一个快速的问题：我看到文件类型和文件大小是“浮动的”。有没有办法将它们封装在 <span class="file-info"> 标记中以用于 CSS 定位？
大家好。该脚本不再起作用，因为显然 URL http://json-head.appspot.com 正在返回 503 响应。有谁知道获取此站点提供的主脚本的方法，以便可以对本地文件进行调用？再次感谢。

【解决方案2】：

如果大小将在 80KB 左右，则不会有问题。将大小放在链接中似乎已经过时了。最简单的方法是计算出理论上的最大值，例如150KB，它永远不会超过，把"Download my resume (PDF / < 150KB)"

除此之外，我认为在客户端执行此操作的唯一方法是下载文件、计算大小并更新链接，这会破坏对象。

【讨论】：

它一点也不过时，你只是想以不同的方式去做，这总比什么都不做要好。 “选择” 80KB 是一个没有考虑用户决定权的任意决定。也许对你来说 80KB 没什么大不了的，但你永远不知道它会给谁。因此，能够读取确切文件大小比“估计”范围更好的用户体验。谢谢。