File.webkitRelativePath
No estándar: Esta característica no es parte de los estándares. No la uses en sitios Web en producción: no funcionará para todos los usuarios. Podrían haber también incompatibilidades considerables entre distintas implementaciones y el comportamiento podría cambiar en el futuro.
La propiedad File.webkitRelativePath
de solo lectura contiene un USVString
(en-US) el cual especifica la ruta relativa del archivo al directorio seleccionado por el usuario en un elemento <input>
con su webkitdirectory
atributo definido.
Sintaxis
js
var rulaRelativa = File.webkitRelativePath;
Valor
Un USVString
(en-US) conteniendo la ruta del archivo relativa al directorio padre seleccionado por el usuario.
Ejemplo
En este ejemplo,un seleccionador de directorios es mostrado al usuario para permitirle seleccionar uno o mas directorios. Cuando el evento change
(en-US) ocurre, una lista de todos los archivos contenidos dentro de la gerarquia de directorio seleccionado es generado y mostrado.
HTML
html
<input type="file" id="filepicker" name="fileList" webkitdirectory multiple />
<ul id="listing"></ul>
JavaScript
js
document.getElementById("filepicker").addEventListener(
"change",
function (event) {
let output = document.getElementById("listing");
let files = event.target.files;
for (let i = 0; i < files.length; i++) {
let item = document.createElement("li");
item.innerHTML = files[i].webkitRelativePath;
output.appendChild(item);
}
},
false,
);
Resultado
Especificaciones
Specification |
---|
File and Directory Entries API # dom-file-webkitrelativepath |
Compatibilidad con navegadores
BCD tables only load in the browser