Alternatives To IFrame Tag In HTML? - QA With Experts

Although is not equivalent of iFrame but you can use these :

1. you can use <embed> element<embed id="123" src="http://google.com" />

works fine in chrome ,safari and firefox, to make it work in firefox, you need wrap it with object<object data="url" type=text/html> <embed src="url" id=123> </embed> </object>

2.  Another way is to Use AJAX call and load the URL into div , like below example$("#area").load("example.html #content");

That finds the content in the file example.html within the element with an ID of contentand puts it on to the current page, inside the element with an ID of area.

3. HTML Imports

You can import external HTML file<!-- Resources on other origins must be CORS-enabled. --> <link rel="import" href="http://somedomain.com/elements.html">

In this way, you can also divide HTML components and re-use same html code.3 At:- 2/23/2018 8:52:19 AM Updated at:- 10/6/2022 6:52:27 AM Comment comment to above answer Answered by:- Vinnu

Content inside iFrame is not indexed by Google and hence no good for SEO, so to avoid it best solution will be jQuery method like below <div id='include-from-outside'></div> <script type='text/javascript'> $('#include-from-outside').load('http://example.com/included.html'); </script>

This will include paste html from url http://example.com/included.html inside div with id='include-from-outside'3 At:- 2/23/2018 4:03:21 PM Comment comment to above answer Answered by:- vikas_jk

I would like to add one more way, since "HTML Import" is obsolete now in most of the major browsers, you can use Javascript's "fetch" to get external HTML into the page.

This can be the example of itclass SampleComponent extends HTMLElement { async connectedCallback() { let res = await fetch( 'your-component.html' ) this.innerHTML = await res.text() } } customElements.define('your-component', SampleComponent)

Since, 'fetch' is an asynchronous function so you will have to use async/await or Promises, as shown above, thanks0 At:- 9/28/2020 1:48:53 PM Comment comment to above answerBuy us a coffee Become a Patron Login/Register to answerOrRegister directly by posting answer/detailsFull Name *Email * By posting your answer you agree on privacy policy & terms of use

Related Articles

Subscribe Now

Subscribe to our weekly Newsletter & Keep getting latest article/questions in your inbox weekly

Related Questions