在H5中国夜,為a標簽新增了一個download屬性拣挪,用于文件的下載畦攘。但是支持該屬性的瀏覽器也只有Firefox和Chrome届吁。
download的屬性值用來指定下載時顯示的文件名集绰,是否使用download屬性的區(qū)別在于:不加download屬性時规辱,瀏覽器會直接瀏覽a的href屬性值,而加了download屬性栽燕,會強制下載該href屬性值內(nèi)容罕袋。
使用download屬性來實現(xiàn)文件下載的代碼如下:
function downloadFileFromText(text, window, document, fileName) {
const bedFile = new Blob([text], { type: 'text/plain' });
const bedFileUrl = window.URL.createObjectURL(bedFile);
const tempLink = document.createElement('a');
document.body.appendChild(tempLink);
tempLink.href = bedFileUrl;
tempLink.setAttribute('download', fileName);
tempLink.click();
window.URL.revokeObjectURL(bedFileUrl);
document.body.removeChild(tempLink);
}
這樣在IE下是沒有任何反應(yīng)的,也不報錯碍岔。若要兼容IE可以使用msSaveBlob
方法浴讯。
function downloadFileFromText(text, window, document, fileName) {
const bedFile = new Blob([text], { type: 'text/plain' });
const bedFileUrl = window.URL.createObjectURL(bedFile);
const tempLink = document.createElement('a');
document.body.appendChild(tempLink);
tempLink.href = bedFileUrl;
tempLink.setAttribute('download', fileName);
tempLink.click();
window.URL.revokeObjectURL(bedFileUrl);
document.body.removeChild(tempLink);
// for IE
if (navigator.msSaveBlob) {
navigator.msSaveBlob(bedFile, fileName);
}
}