如何 iframe 网站的特定部分？答案

【问题标题】：How to iframe a specific part of a website?如何 iframe 网站的特定部分？
【发布时间】：2013-11-04 08:11:48
【问题描述】：

<div style="border: 3px solid rgb(201, 0, 1); overflow: hidden; max-width: 736px;">
<iframe scrolling="no" src="http://freegeoip.net/" style="border: 0px none; margin-left: -20px; height: 448px; margin-top: -98px; width: 100%;">
</iframe>
</div>

我当前的代码，我想 iframe 的 freegeoip.net 地图并在我的网站上显示给访问者，但我得到了这个：http://i.imgur.com/tacaODX.png

如您所见，右侧有一个空白空间，我不知道如何修复那个...尝试了所有方法。

【问题讨论】：

较小的 iframe 是什么意思？
缩小 iframe 以适应地图大小
怎么样？我尝试更改值，这是我能想到的最好的值...当我从现在开始尝试更改某些内容时，一切都变得很奇怪..

标签： html css iframe

【解决方案1】：

我知道这不是您真正要求的，但您可以使用他们的 API，使用 Google 地图 API 将其编程到 Google 地图中并不难。我为你做了一个小（快速）的例子。

$.getJSON('http://freegeoip.net/json/', function(data) {
    lat = data.latitude;
    lng = data.longitude;

    initialize();
});

工作示例： http://jsfiddle.net/qx4KF/

它会搜索您的 IP 并将其显示在地图上，您还可以在地图上添加一些标记以创建与 freegeoip.net 相同的视图。对于标记，您可以使用以下内容：

 var myLatlng = new google.maps.LatLng(lat, lng);

 var marker = new google.maps.Marker({
                position: myLatlng,
                map: map,
                title: 'Hello World!'
 });

有关 Google 地图 API 的更多信息：https://developers.google.com/maps/documentation/javascript/examples/

【讨论】：

【解决方案2】：

如果javascript 和jQuery 库没有问题，您可以使用jQuery 中的load 方法加载外部页面的一部分，使用例如，您想要获取的 div。

见Use Ajax() function in Jquery to load PART of an external page into div

更新

.load() 方法允许指定要插入的远程文档的一部分

$( "#result" ).load("http://freegeoip.net/ #map");

见http://api.jquery.com/load/

【讨论】：

不幸的是，在这种情况下这是一个问题，因为我从中获取 iframew 的网站不提供此功能.. 也不是我自己的网站。
您想要显示的 freegeoip 索引页面的具体部分是什么？只有地图？
地图。我想让访客在地图上显示他的位置。
地图位于ID为“map”的iframe中。