① html5中對文件路徑的操作是絕對路徑還是相對路徑
不管是HTML還是HTML5都是有2種路徑寫法:相對路徑和絕對路徑:
HTML相對路徑(Relative Path)
用途:指定由這個文件所在的路徑引起的跟其它文件(或文件夾)的路徑關系
如果源文件和引用文件在同一個目錄里,直接寫引用文件名即可,這時引用文件的方式就是使用相對路徑。
下面建立兩個HTML文檔info.html和index.html,用作示例,要求都是在info.html加入index.html超鏈接。
eg1:相對路徑的簡單應用
假設:info.html路徑是:c:/Inetpub/wwwroot/sites/blabla/info.html
index.html路徑是:c:/Inetpub/wwwroot/sites/blabla/index.html
寫法:<a href = "index.html">這是超連接</a>
eg2:如何表示上級目錄
../表示源文件所在目錄的上一級目錄,http://www..com/表示源文件所在目錄的上上級目錄,以此類推。
假設:info.html路徑是:c:/Inetpub/wwwroot/sites/blabla/info.html
index.html路徑是:c:/Inetpub/wwwroot/sites/index.html
寫法:<a href = "../index.html">這是超連接</a>
eg3:如何表示上上級目錄
假設:info.html路徑是:c:/Inetpub/wwwroot/sites/blabla/info.html
index.html路徑是:c:/Inetpub/wwwroot/sites/wowstory/index.html
寫法:<a href = "../wowstory/index.html">index.html</a>
eg3:如何表示下級目錄
引用下級目錄的文件,直接寫下級目錄文件的路徑即可。
假設:info.html路徑是:c:/Inetpub/wwwroot/sites/blabla/info.html
index.html路徑是:c:/Inetpub/wwwroot/sites/blabla/html/index.html
寫法:<a href = "html/index.html">這是超連接</a>
2.HTML絕對路徑(Absolute Path)
大家都知道,在我們平時使用計算機時要找到需要的文件就必須知道文件的位置,而表示文件的位置的方式就是路徑。
例如只要看到這個路徑:c:/website /img/photo.jpg我們就知道photo.jpg文件是在c盤的website目錄下的img子目錄中。
類似於這樣完整的描述文件位置的路徑就是絕對路徑。我們不需要知道其他任何信息就可以根據絕對路徑判斷出文件的位置。
HTML絕對路徑(absolute path)在網頁製作中指帶域名的文件的完整路徑。
② html5能獲取上傳獲取文件絕對路徑嗎怎麼獲取
<!DOCTYPE html>
<html>
<body>
<input type="file" id='up' oninput="get()" />
<script>
function get() {
let fup = document.getElementById('up');
console.log("本地文件路徑:" + fup.value)
}
</script>
</body>
</html>
③ HTML5如何獲取文件路徑
html通過file獲取文件路徑方法:
File f = new File(this.getClass().getResource("/").getPath());
System.out.println(f);
結果:
C:Documents%20and%in
獲取當前類的所在工程路徑;
如果不加「/」
File f = new File(this.getClass().getResource("").getPath());
System.out.println(f);
結果:
C:Documents%20and%incom est
獲取當前類的絕對路徑;
④ html5 打開本地文件夾
在HTML5里,從Web網頁上訪問本地文件系統變的十分的簡單,那就是使用 API。這個File規范說明裡提供了一個API來表現Web應用里的文件對象,你可以通過編程來選擇它們,訪問它們的信息。這個File API包括:
一個FileList序列,代表著由本地系統里選中的單個的文件組成的數組。用來選擇文件的用戶介面可以通過<input type=」file」>調用實現。
一個Blob介面,它代表原始二進制數據,通過Blob對象你可以訪問裡面的位元組數據。
一個File介面,它裡面存有文件的只讀屬性信息,像文件名,文件類型,文件數據訪問的地址。
一個FileReader介面,它提供了讀取一個文件的方法,和一個獲取文件讀取結果的事件模型。
一個FileError介面和一個FileException對象,它們用來定義這個規范中的錯誤產生條件。
如何使用這個例子:在這個例子中,我給出了一個畫板,你可以從本地文件系統里拖拽進去一個圖片,或者你也可以用文件選擇框來選擇圖片。例子中,請只選擇圖片文件,我並沒有添加文件過濾和文件類型檢查。請記住,沒有一個瀏覽器完全實現了HTML5,這個例子需要在支持HTML5的瀏覽器上運行,比如Firefox3.5以上。
實現File API的主要方法非常的簡單,就像下面:
functionimagesSelected(myFiles){
for(vari=0,f;f=myFiles[i];i++){
varimageReader=newFileReader();
imageReader.onload=(function(aFile){
returnfunction(e){
varspan=document.createElement(『span『);
span.innerHTML=['<imgclass="images"src="',e.target.result,'"title="',aFile.name,'"/>'].join(」);
document.getElementById(『thumbs』).insertBefore(span,null);
};
})(f);
imageReader.readAsDataURL(f);
}
}
functiondropIt(e){
imagesSelected(e.dataTransfer.files);
e.stopPropagation();
e.preventDefault();
}
選擇在<td>上放置ondrop事件:
<tdalign=」left」height=」105″ondragenter=」returnfalse」ondragover=」returnfalse」ondrop=」dropIt(event)」>
<outputid=」thumbs」></output>
</td>