How to get a specific region from an iframe?

Asked

Viewed 1,179 times

1

I created an iframe from any site. I would like to define a specific region. It is possible to do this?

html5 iframe
  • 1

    What do you mean by region specifies?

  • 1

    is talking about something that is contained within the iframe or is talking about taking some attribute value?

  • For example, let’s say I want to pick up a footer or a specific div. It’s not a data Crawler, but a pixel region (maybe) of another site.

  • You want to display in iframe only a part of the site. But the iframe size is dynamic tb or fixed?

2 answers

1

From what I understand, you want to have access to the html of the site loaded by iframe, have several ways to do, one of them would be a stylized selector to access the body of the site from the iframe loaded.

var iframeBody = $('body', $('iframe')[0].contentWindow.document); // Acesso ao body do site jsfiddle
console.log(iframeBody.find('ul').width()); // pega a largura do menu do site jsfiddle
console.log(iframeBody.find('ul').height()); // pega a altura do menu do site jsfiddle

<iframe width="100%" src="https://jsfiddle.net/"></iframe>

See worked on jsfiddle

After you already have access to the object just use the functions. width/height to take width and height and perform other customizations as needed.

  • It would not be to access the html loaded by iframe. But, to delimit the contents of iframe in a specific region. For example site A has a news region. I want to create an iframe on site B with site specific region A.

  • @Brunonascimento and just make a copy of html and put this html in the iframe

  • It’s from a dynamic site that I need a specific area. I can’t just copy html.

  • @Brunonascimento picks up dynamically! take a look at this example, you load the page and load only what you want, in this example only two links: https://jsfiddle.net/gabrielr47/q5neL8fg/2/

0

I believe that’s what you want:

window.frames['iframe01'].document.body.innerHTML

Or try this for Firefox or Chrome:

window.frames[0].document.body.innerHTML

You can also:

Use a div and use Jquery to load only the part you want:

$('#target-div').load('http://www.mywebsite.com/portfolio.php #portfolio-sports');

Browser other questions tagged html5 iframe

You are not signed in. Login or sign up in order to post.