Javascript 从另一个网站显示 div

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/2828109/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 02:05:31  来源:igfitidea点击:

Show div from another website

javascripthtmlgoogle-mapsiframe

提问by Joshua Slocum

Is there a way to use an iframe or some other method of showing a named div from another website?

有没有办法使用 iframe 或其他一些方法来显示来自另一个网站的命名 div?

I want to pull in some data from a government website into a google map and when they click the point I want the information from one of the divs on that page to display.

我想将政府网站上的一些数据提取到谷歌地图中,​​当他们单击该点时,我希望显示该页面上一个 div 中的信息。

采纳答案by Vishal Seth

I take assumption that you are sure of div's ID in that other website.

我假设您确定该其他网站中的 div ID。

If yes. use Jquery Ajax to pull the site's content into a hidden iframe in your site. then fetch the content of the div-in-question into some variable and then you can use it for your purpose (parse html table data or do whatever)

如果是。使用 Jquery Ajax 将站点的内容拉入站点中隐藏的 iframe。然后将 div-in-question 的内容提取到某个变量中,然后您可以将其用于您的目的(解析 html 表数据或执行任何操作)

Discard the iframe's content so that you don't have unnecessary items in your page's DOM.

丢弃 iframe 的内容,这样页面的 DOM 中就没有不必要的项目。

回答by Falle1234

Using JQuery, you should be able to exactly that with the load-function.

使用 JQuery,您应该能够通过加载函数完全做到这一点。

Here is a small example to get a container with id "container" on a page called Test.html:

这是在名为 Test.html 的页面上获取 ID 为“container”的容器的小示例:

$('#contentDiv').load('/Test.html #container');

$('#contentDiv').load('/Test.html #container');

You can visit the JQuery documentation herefor more info.

您可以在此处访问 JQuery 文档以获取更多信息。

回答by Aren

  1. Ajax Call
  2. In-House Service to Scrape the HTML from the page
  3. Select the div with xpath / SGML parser
  4. Return to ajax call-handler
  5. Replace the content of your div
  1. Ajax 调用
  2. 从页面中抓取 HTML 的内部服务
  3. 使用 xpath / SGML 解析器选择 div
  4. 返回 ajax 调用处理程序
  5. 替换 div 的内容

HoweverThere are other problems, i.e. scraping someone's site for their content without their permission is BAD.

然而,还有其他问题,即在未经他们许可的情况下抓取某人的站点以获取他们的内容是很糟糕的。

They may or may not care, but still you should seek permission, or one day you could find your webserver blacklisted from their site. Or worse... Especially a government site.

他们可能在乎也可能不在乎,但您仍然应该寻求许可,或者有一天您会发现您的网络服务器从他们的网站上列入黑名单。或者更糟……尤其是政府网站。

You should probably go about figuring out how to properly obtain the data you need (perhaps there's an api somewhere) and then render your own version.

您可能应该弄清楚如何正确获取您需要的数据(也许某处有一个 api),然后呈现您自己的版本。

回答by Seidr

You would have to make use of either JSONP or a middle-agent to retrieve the data (i.e. a PHP script using the CURL library).

您必须使用 JSONP 或中间代理来检索数据(即使用 CURL 库的 PHP 脚本)。

JSONP functionality is included in numerous Javascript libraries such as MooTools and jQuery. That is the method I would use.

JSONP 功能包含在许多 Javascript 库中,例如 MooTools 和 jQuery。这就是我会使用的方法。

MooTools: http://mootools.net/docs/more/Request/Request.JSONP

MooTools:http: //mootools.net/docs/more/Request/Request.JSONP

jQuery: http://docs.jquery.com/Release:jQuery_1.2/Ajax

jQuery:http://docs.jquery.com/Release: jQuery_1.2/Ajax

Once you have retrieved the body of the page the DIV resides on, you could use REGEX to extract the information from the specific DIV element.

一旦检索到 DIV 所在页面的正文,就可以使用 REGEX 从特定 DIV 元素中提取信息。