同一個(gè)網(wǎng)站的不同html文件是如何關(guān)聯(lián)的?
網(wǎng)友解答: 這個(gè)問題有點(diǎn)意思,帶點(diǎn)小總結(jié)的意味。按我的理解,題主所說的關(guān)聯(lián)應(yīng)該是互相調(diào)用吧?簡單總結(jié)下,最常見的有三種方式。通過a標(biāo)簽跳轉(zhuǎn)為說明問題方便,我們簡單的做兩個(gè)html文件,一
這個(gè)問題有點(diǎn)意思,帶點(diǎn)小總結(jié)的意味。按我的理解,題主所說的關(guān)聯(lián)應(yīng)該是互相調(diào)用吧?簡單總結(jié)下,最常見的有三種方式。
通過a標(biāo)簽跳轉(zhuǎn)為說明問題方便,我們簡單的做兩個(gè)html文件,一個(gè)是a,一個(gè)是b。
a.html代碼如下圖:
b.html代碼如下圖:
當(dāng)在瀏覽器中運(yùn)行a.html時(shí),點(diǎn)擊a標(biāo)簽將跳轉(zhuǎn)到另外一個(gè)頁面,如下圖(請(qǐng)注意看瀏覽器地址欄上的頁面文件地址,已經(jīng)從a.html變成b.html了):
同樣的道理,當(dāng)在B頁面中點(diǎn)擊也能跳回到A頁面。
當(dāng)使用這種跳轉(zhuǎn)方式時(shí),還可以跳轉(zhuǎn)到另一個(gè)頁面中的指定錨點(diǎn)位置。例如,將B頁面中的代碼做如下修改:
由于這里增加了2個(gè)div,加上原來的div,高度就太高了,需要滾動(dòng)條才能查看:
假如希望從A頁面跳轉(zhuǎn)到B頁面時(shí),直接顯示到B頁面的底部,可以在B頁面中設(shè)置錨定位置,同時(shí)修改A頁面中的跳轉(zhuǎn)地址:
這樣,當(dāng)從A頁面中點(diǎn)擊跳轉(zhuǎn)到B頁面時(shí),會(huì)直接顯示到底部。如下圖:
同一個(gè)頁面中也可以設(shè)置錨定跳轉(zhuǎn),比如從底部跳到頂部,從頂部跳到底部等等,無非是不用寫頁面地址而已。
使用文檔嵌入方式剛才的a標(biāo)簽執(zhí)行的是跳轉(zhuǎn),當(dāng)從這個(gè)頁面跳到另一個(gè)頁面后,就和原來的頁面沒關(guān)系了。假如希望將兩個(gè)頁面的內(nèi)容合并到一起,可使用文檔嵌入方式,這就要用到iframe標(biāo)簽。例如,將B頁面的內(nèi)容嵌入到A頁面中,同時(shí)為了讓效果看的更明顯,兩個(gè)頁面的代碼分別做如下修改:
這時(shí)再運(yùn)行A頁面,B頁面中的內(nèi)容就被嵌入到A頁面中了。運(yùn)行效果如下圖:
使用Ajax加載這種方式其實(shí)是最好、也是最靈活的加載其它頁面內(nèi)容的方式。假如同樣是將B頁面內(nèi)容加載到A頁面中一起顯示,只需將A頁面做如下修改:
運(yùn)行效果和上面的iframe方式相同。這樣的代碼雖然看起來多了點(diǎn),但其靈活性、易用性非常強(qiáng),相信有過ajax使用經(jīng)驗(yàn)的人一定對(duì)此深有體會(huì)!
代碼編程雖然看起來很難,但類似的書其實(shí)可以寫的很淺顯易懂并不要那么多的長篇大論。我很討厭故作高深的所謂專業(yè)書,所以就自己寫了本《B/S項(xiàng)目開發(fā)實(shí)戰(zhàn)》,涵蓋了HTML+CSS+JavaScript+jQuery+PHP+MySQL等方面的內(nèi)容。我是人民郵電出版社簽約作者,期待您的關(guān)注,希望有機(jī)會(huì)和大家一起交流提高,謝謝!