我想在iframe中更改元素的宽度

Question

我在单个帖子的左侧使用了社交侧边栏。 我想以相同大小显示所有按钮，但现在它们以不同大小显示。 我要使它们的大小都相同，例如“ twitter”按钮。 如需检查，请到这里 。

我尝试了许多代码，但由于它们的来源是Iframe，所以我的编码无法正常工作。 对于google +，我使用了以下代码：

$('#___plusone_1 iframe').load(function(){
  $('#___plusone_1 iframe').contents().addClass('googleplusbtn');
 }

那你能帮我吗？ 谢谢。

我也检查了这些教程，但对我不起作用：

jQuery更改iFrame的内容

jQuery / JavaScript：访问iframe的内容

Answer 1

我认为您无法实现此目标，因为您的主页（ http://site4preview.site90.net/ ）和iframe（ http://www.facebook.com/plugins/like.php ）位于不同的域中。

jQuery Contents功能描述：

如果iframe与主页位于同一域中，则.contents（）方法还可用于获取iframe的内容文档。

资料来源： JQuery .contents（）

Answer 2

如果iframe网址来自同一域。 然后，您可以使用：

jQuery的：

$("#iFrame").contents().find(".someButtons").addClass("googleplusbtn");

Answer 3

如果iframe包含相同应用程序域的页面，则可以通过以下方式实现：

var iframe = document.getElementById('html2');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

一旦获得对象，现在就可以访问：

innerDoc.getElementById('divId').style.width="250px";

Answer 4

您可以使用jQuery轻松更改iFrame的宽度。此解决方案与iFrame相同。 我创建了一个PHP脚本，可以从其他网站获取所有内容，而最重要的部分是您可以轻松地将自定义jQuery应用于该外部内容。 请参考以下脚本，该脚本可以从其他网站获取所有内容，然后您也可以应用自定义jQuery / JS。 此内容可以在任何元素或任何页面内的任何位置使用。

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
  Function to display frame from another domain 
*/

function displayFrame()
{
  $webUrl = 'http://[external-web-domain.com]/';

  //Get HTML from the URL
  $content = file_get_contents($webUrl);

  //Add custom JS to returned HTML content
  $customJS = "
  <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
    //Hide Navigation bar
    jQuery(\".navbar.navbar-default\").hide();

  </script>";

  //Append Custom JS with HTML
  $html = $content . $customJS;

  //Return customized HTML
  return $html;
}

Answer 5

您可以使用jQuery轻松更改宽度。 此解决方案与iFrame相同。 我创建了一个PHP脚本，可以从其他网站获取所有内容，而最重要的部分是您可以轻松地将自定义jQuery应用于该外部内容。 请参考以下脚本，该脚本可以从其他网站获取所有内容，然后您也可以应用自定义jQuery / JS。 此内容可以在任何元素或任何页面内的任何位置使用。

<div id='myframe'>

  <?php 
   /* 
    Use below function to display final HTML inside this div
   */

   //Display Frame
   echo displayFrame(); 
  ?>

</div>

<?php

/* 
  Function to display frame from another domain 
*/

function displayFrame()
{
  $webUrl = 'http://[external-web-domain.com]/';

  //Get HTML from the URL
  $content = file_get_contents($webUrl);

  //Add custom JS to returned HTML content
  $customJS = "
  <script>

      /* Here I am writing a sample jQuery to hide the navigation menu
         You can write your own jQuery for this content
      */
    //Hide Navigation bar
    jQuery(\".navbar.navbar-default\").hide();

  </script>";

  //Append Custom JS with HTML
  $html = $content . $customJS;

  //Return customized HTML
  return $html;
}