许多Web应用程序需要在前端处理文件输入，或者将文件上传到后端。在本文中，我们将了解如何使用对象URL来引用可以使用DOM文档对象引用的数据。使用对象URL，我们可以调用URL.createObjectURL从文件对象创建URL字符串对象，如下所示。constobjectURL=window.URL.createObjectURL(fileObj);然后我们可以在URL字符串对象上调用revokeURL以从内存中释放URL资源：URL.revokeObjectURL(objectURL);使用对象URL显示图像例如，我们可以使用createObjectURL方法在img元素中显示选定的图像文件，如下所示。首先，我们编写如下HTML：![]()
然后，我们可以编写如下代码来监听文件输入的变化事件，然后使用createObjectURL来设置img元素的src属性，如下：constfileInput=document.querySelector('input');constimg=document.querySelector('img');fileInput.onchange=()=>{constfile=fileInput.files[0];img.src=URL.createObjectURL(file);img.onload=()=>{URL.revokeObjectURL(img.src);}}在上面的代码中，我们在选定的文件对象文件上调用了createObjectURL来创建src可以设置为属性值的URL。然后，当加载图像时，我们调用revokeObjectURL来清除用于创建URL的资源。使用对象URL显示PDF我们也可以使用对象URL来显示PDF。我们使用相同的crateObjectURL方法，但将其设置为iframe的URL而不是img元素。例如，我们可以编写以下HTML：
