使用JavaScript从Imgur API获取URL

我正试图通过以下方式使用JavaScript将图像上传到imgur：

Yo。
滴或者点击
/*拖拽的东西*/
window.ondragover=函数（e）{e.preventDefault（）}
window.ondrop=函数（e）{e.preventDefault（）；上载（e.dataTransfer.files[0]）；}
功能上传（文件）{
/*文件是图像吗*/
如果（！file | |！file.type.match（/image.*/）返回；
/*是的*/
document.body.className=“上传”；
/*让我们构建一个FormData对象*/
var fd=new FormData（）；//我写过：https://hacks.mozilla.org/2011/01/how-to-develop-a-html5-image-uploader/
fd.append（“image”，file）；//追加文件
fd.append（“key”，“6528448c258cff474ca9701c5bab6927”）；//获取您自己的密钥http://api.imgur.com/
var xhr=new XMLHttpRequest（）；//创建xhr（跨域xhr FTW！！！）非常感谢您
xhr.open（“POST”http://api.imgur.com/2/upload.json）；//嘘！
xhr.onload=函数（）{
//大胜利！
document.querySelector（“#link”）.href=JSON.parse（xhr.responseText）.upload.links.imgur_页面；
document.body.className=“上传”；
}
//好的，我不处理这些错误。这是给读者的练习。
/*现在，我们发送表单数据*/
xhr.send（fd）；
}
正文{文本对齐：居中；填充顶部：100px；}
div{边框：10px纯黑色；文本对齐：中心；行高：100px；宽度：200px；边距：自动；字体大小：40px；显示：内联块；}
#link，p，div{display:none}
div{display:inline块；}
.正在上载div{display:none}
.上载的div{display:none}
.正在上载p{display:inline}
.Upload#link{display:inline}
em{位置：绝对；底部：0；右侧：0}
上传

它是在线的！！！

这个例子将图像url放在一个链接中，并喜欢文本“它在线！！！”

---

你能帮我上传后如何获取图片的URL吗？我希望显示图像URL（例如，用URL替换“It's online！！！”），而不是将其放在链接中。

设置链接的

href

值，而不是设置链接的

innerHTML

值。或者其他元素的

innerHTML

值

document.getElementById('link').innerHTML = 'The url';

编辑：请参见

URL位于JSON.parse（xhr.responseText）.upload.links.imgur\u页面中，但如何显示它？我不懂Javascript。我用“document.getElementById（'link'）.innerHTML”替换了“document.querySelector（'link'）.href”，但它不起作用。什么元素是

#link

？你能给我看看HTML代码吗？（你可以编辑你的帖子）我编辑了代码（来源：）。请给我一些建议。请看这里：只需拖放一些图像到其中进行测试。我基本上在代码中添加了我建议的行。如果您的帖子对您有帮助，请将其标记为已回复！；）

document.getElementById('link').innerHTML = 'The url';