如何從外部網頁引用HTML

我有網頁A有一個網頁B的鏈接。我需要找到網頁B的鏈接（很簡單），然後將網頁B中的HTML存儲在我的JavaScript腳本中的變量中。

存儲從網頁A上的HTML，我知道這是一個簡單的：

html_A = document.body.innerHTML;

如何存放從網頁B的HTML？我相信我需要使用AJAX正確嗎？或者我可以用JavaScript做到這一點？如果是前者，讓我們假設網頁B的服務器允許它。

預先感謝您！

來源

2015-02-11 John Leake

如果你打算使用jQuery（你已經標記了），看看這個：http://api.jquery.com/load/#loading-page-fragments – Jack 2015-02-11 18:39:48

這僅在網頁B由於the same-origin policy security feature of all major browsers而處於相同域時纔可能。

如果這兩個網頁是在同一個域，你可以做

$.get("/uri/to/webpage/b").then(function(html) { 
    //do something with the html; 
});

注意，HTML將只提供一次Ajax請求的.then(...)函數內完成。它將不在在這個代碼塊後在線上可用。

很難說，不知道更多關於你的情況，但這很少是正確的事情。您可能需要查看$.fn.load()（受SOP限制）或使用iframes（不受SOP限制），因爲其中一個可能更合適。

我應該注意到，當你需要從另一個域訪問html時，這樣做的標準方法是在你的web服務器上將它拉下來，然後從那裏重新提供它。這就是說，這可能是違反該網站的使用條款。

來源

2015-02-11 18:41:48

我同意。如果您嘗試從不同的域中獲取頁面，則會出現如下錯誤：「跨源請求被阻止：同源策略不允許讀取WEBSITE B處的遠程資源。可以通過將資源移動到相同的源域或啓用CORS' – CodeGodie 2015-02-11 18:47:45

如果您試圖從駐留在不同服務器上的網站加載HTML，則會出現Cross-Origin Request Blocked錯誤。我在過去處理過這個問題，並找到了一種使用YQL的方法。試試看：

//This code is located on Website A 
$(document).ready(function() { 
    var websiteB_url = 'http://www.somewebsite.com/page.html'; 
    var yql = '//query.yahooapis.com/v1/public/yql?q=' + encodeURIComponent('select * from html where url="' + websiteB_url + '"') + '&format=xml&callback=?'; 
    $.getJSON(yql, function(data) { 
     function filterDataCUSTOM(data) { 
      data = data.replace(/<?\/body[^>]*>/g, '');// no body tags 
      data = data.replace(/[\r|\n]+/g, ''); // no linebreaks 
      return data; 
     } 
     if (data.results[0]) { 
      var res = filterDataCUSTOM(data.results[0]); 
      $("div#results").html(res); 
     } else { 
      console.log("Error: Could not load the page."); 
     } 
    }); 
});

來源

2015-02-11 18:51:51 CodeGodie

yikes！雅虎公開這種功能？任何想法他們做什麼緩存？另外，我不確定我瞭解您的查詢。你在url中指定格式爲xml，但getJSON將格式設置爲Json（這是你回來的）。你也可以使用'＆callback =？'，它用於jsonp，但你顯然不使用jsonp。 – 2015-02-11 19:23:04

如何從外部網頁引用HTML

回答

相關問題