HTML中的img元素：file属性和src属性的行为不同

Question

我有一个file属性，该属性保存在某个<img id = "one">元素上。所述file属性包含File type的对象。我有另一个<img id = "two">元素。当我尝试这个：

document.getElementById('two').src = document.getElementById('one').file

它的行为与以下内容不同：

document.getElementById('two').file = document.getElementById('one').file

第一行代码返回string中包含的我的File的{​​{1}}表示形式，第二行代码返回实际的img one对象强>。这种行为差异是什么？

Answer 1

HTMLImageElement的{​​{3}}，因此，当您分配document.getElementById('two').file时，您只是在表示file的JavaScript对象上创建了<img id="two">属性。访问该属性，然后取回您放入的File。

但是document.getElementById('two').src是一个don't have a file attribute，反映了src元素的img内容属性。 src内容属性包含图像的地址，因此，当您从JavaScript访问src IDL属性时，会将文件转换为字符串：

  

IDL attribute

     

定义了一些IDL属性以反映特定的内容属性。这意味着IDL属性在获取时将返回content属性的当前值，而IDL属性在设置时会将content属性的值更改为给定值。

     

[...]

     

如果反映IDL属性是USVString属性，其content属性定义为包含URL，则在获取时，如果content属性不存在，则IDL属性必须返回空字符串。否则，IDL属性必须解析相对于元素的节点文档的content属性的值，如果成功，则返回结果URL字符串。如果解析失败，则必须返回content属性的值，并将其转换为USVString。

Answer 2

如果要使用文件，请使用app_name，否则不能将“文件”放入<input type="file">标记中