load()方法---------jQuery動態載入html
阿新 • • 發佈：2019-01-10
- jquery程式碼
- $("#div").load("test.html");
test.html ----------------被載入頁面（有<HTML><HEAD><META><BODY>等的完整頁面 ）
$("#div")所在頁面----------------------------容器頁面（也是完整頁面）
- 1、被載入頁面 可以使用 自己頁面的CSS樣式
- 2、被載入頁面 可以使用 容器頁面的CSS樣式，當自己頁面css樣式和容器頁面的CSS樣式衝突時，自己頁面的css樣式起作用！
- 3、被載入頁面
能使用 自己頁面的javascript
- 4、被載入頁面
能使用 容器頁面的javascript，當自己頁面javascript和容器頁面的javascript衝突時，都起作用，形成“冒泡”；
- 5、 容器頁面的head裡面的 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> ） 對 被載入頁面 無效
- 6、 被載入頁面的head裡面的 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> ） 對 被載入頁面 無效
- 7、被載入頁面的字元編碼只能是UTF-8
- jquery程式碼
- load() 方法允許載入html文件的一部分，語法如下：
- $("#div").load("test.html #content");
- test.html #content（中間有一個空格） ----------------被載入頁面的id是content的部分
- 載入html文件的一部分的情況有所不同（自己頁面的css樣式和javascript都丟失，能使用容器頁面的css樣式和javascript），
- 不過都是按照下面做法實現的，可以根據 把html檔案載入到容器頁面形成的文件情況 而定
- w3cshcool說load() 方法是這樣實現的：
- jQuery 使用瀏覽器的 .innerHTML 屬性來解析被取回的文件，並把它插入當前文件。在此過程中，瀏覽器常會從文件中過濾掉元素，
- 比如 <html>, <title> 或 <head> 元素。結果是，由 .load() 取回的元素可能與由瀏覽器直接取回的文件不完全相同。
- 註釋：由於瀏覽器安全方面的限制，大多數 "Ajax" 請求遵守同源策略；請求無法從不同的域、子域或協議成功地取回資料。