A RetroSearch Logo

Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Search Query:

Showing content from https://developer.mozilla.org/en-US/docs/Web/API/File/webkitRelativePath below:

File: webkitRelativePath property - Web APIs

File: webkitRelativePath property

Note: This feature is available in Web Workers.

The webkitRelativePath read-only property of the File interface contains a string which specifies the file's path relative to the directory selected by the user in an <input> element with its webkitdirectory attribute set.

Value

A string containing the path of the file relative to the ancestor directory the user selected.

Example

In this example, a directory picker is presented which lets the user choose one or more directories. When the change event occurs, a list of all files contained within the selected directory hierarchies is generated and displayed.

HTML
<input type="file" id="file-picker" name="fileList" webkitdirectory multiple />
<output id="output"></output>
output {
  display: block;
  white-space: pre-wrap;
}
JavaScript
const output = document.getElementById("output");
const filePicker = document.getElementById("file-picker");

filePicker.addEventListener("change", (event) => {
  const files = event.target.files;

  for (const file of files) {
    output.textContent += `${file.webkitRelativePath}\n`;
  }
});
Result Specifications Browser compatibility See also

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4