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

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

<input type="file" id="filepicker" name="fileList" webkitdirectory multiple />
<ul id="listing"></ul>

JavaScript

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

Especificacion	Estado	Comentario
File and Directory Entries API La definición de 'webkitRelativePath' en esta especificación.	Draft	Especificacion inicial.

Esta API no tiene especificacion W3C o WHATWG.

Compatibilidad con navegadores

BCD tables only load in the browser