How to load external website into an using jQuery?</h1> <div class="qa_category"> <div id="divCategories"> <a href='https://www.tutorialspoint.com/articles/category/jQuery' target='_blank'><span>jQuery</span></a><a href='https://www.tutorialspoint.com/articles/category/Web-Development' target='_blank'><span>Web Development</span></a><a href='https://www.tutorialspoint.com/articles/category/Front-End-Technology' target='_blank'><span>Front End Technology</span></a></div> <hr/> <div id="adp_top_ads" style="text-align:center !important;"></div> <script> var adPos = document.getElementById('adp_top_ads'); var ad_id_720 = "8014640d-fd34-4b2e-9b1b-cc67234a2325"; var ad_id_650 = "2d1bb2c4-eb72-471d-9c80-1bf5514728c1"; var ad_id_300 = "df94a1a9-ae2f-432d-9a92-d93823ff4503"; var width = window.innerWidth; var ad_id = ad_id_720; if( width <= 768 ){ ad_id = ad_id_300; }else if( width <= 1435 ){ ad_id = ad_id_650; } adPos.innerHTML = '<div id="' + ad_id + '" class="_ap_apex_ad"></div>'; var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd(ad_id); }); </script> </div> <hr/> <div id="divResources"> </div> <div id="downloadContent"> <p style="">To load an external HTML into <iframe> using jQuery, use the <em>attr()</em> method. In that set the source for iframe. You can try to run the following code to learn how to locate external HTML −</p><h2 style="">Example</h2><p style=""><a href="http://tpcg.io/vGxwPv" rel="nofollow noopener noreferrer" target="_blank">Live Demo</a></p><pre class="prettyprint notranslate"><!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <script> $(document).ready(function(){    $('#iframe').attr('src', 'https://www.qries.com'); }); </script> </head> <body> <iframe id="iframe" name="myIframe" frameborder="5" width="500" height="300"></iframe> </body> </html></pre></div> <div class="clear"></div> <div class="qa_widget mui-panel prof-view-artcle"> <div class=""> <a href='https://www.tutorialspoint.com/authors/Amit-D' target='_blank' title="Amit D" class="mui--pull-left"> <img class="profile-img1" src='https://www.tutorialspoint.com/assets/profiles/13349/profile/60_63530-1512538715.jpg' alt='Amit D'/> </a> <div class="qa_author"> <a href='https://www.tutorialspoint.com/authors/Amit-D' target='_blank'><span>Amit D</span></a> <p class="prof-desigtn mb-0"><b></b></p> </div> <div class="d-flex"> <h4 class="followers-count" id="followersCount"><a href="https://www.tutorialspoint.com/followers/Amit-D" title="View Followers"><span> 0 Followers</span></a></h4> <div id="divFollow"> <a href="javascript:void(0);" class="follow-author rounded"><i class="fas fa-user-plus"></i> Follow</a></div> </div> </div> <div class="clear"></div> <hr> <div class="qa_answer_dtm author-profile-post-info" id="divStats"> <div class="mt-2">Updated on 17-Feb-2020 06:49:45</div> <p class="views-count" title="Article Views"><b><i class="fal fa-eye"></i> <span id="spanViews">0 Views</span></b></p> <p class="like-dislike" id="pLike" title="Like Article"><b><i class="fal fa-thumbs-up"></i> <span> 0</span></b></p> <a href="javascript:void(0)" id="print-page" class="like-dislike d-none d-sm-block"><i class="fal fa-print"></i> Print Article</a> <div class="uthor-prof-social-icon mt-2"> <span class="share-options"> <a onclick="copyToClipboard();" title="Copy To Clipboard" class=""><b><i class="fal fa-link"></i></b></a> <a id="ancFBShare" onClick="window.open('http://www.facebook.com/sharer/sharer.php?u=https://www.tutorialspoint.com/How-to-load-external-website-into-an-iframe-using-jQuery&t=How to load external website into an using jQuery?&description=How to load external website into an using jQuery? - To load an external HTML into using jQuery, use the attr() method. In that set the source for iframe. You can try to run the following code to learn how to locate external HTML −ExampleLive Demo ','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on Facebook"><i class="fab fa-facebook-f ms-2 me-1"></i></a> <a onClick="window.open('http://www.linkedin.com/shareArticle?url=https://www.tutorialspoint.com/How-to-load-external-website-into-an-iframe-using-jQuery&title=How to load external website into an using jQuery?&summary=How to load external website into an using jQuery? - To load an external HTML into using jQuery, use the attr() method. In that set the source for iframe. You can try to run the following code to learn how to locate external HTML −ExampleLive Demo ','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on LinkedIn"><i class="fab fa-linkedin-in me-2"></i></a> <a onClick="window.open('http://www.twitter.com/intent/tweet?url=https://www.tutorialspoint.com/How-to-load-external-website-into-an-iframe-using-jQuery&text=How to load external website into an using jQuery? - To load an external HTML into using jQuery, use the attr() method. In that set the source for iframe. You can try to run the following code to learn how to locate external HTML −ExampleLive Demo ','sharer','toolbar=0,status=0,width=580,height=325');" href="javascript: void(0)" title="Share on Twitter"><i class="fab fa-twitter me-1"></i></a> </span> </div> </div> </div> <ul class="toc chapters"> <li class="heading big-font" style="font-size: 25px!important;border: 0px;"><i class="fal fa-money-check-edit me-2"></i> Related Articles</li><li><a href="https://www.tutorialspoint.com/How-to-load-external-HTML-into-a-div-using-jQuery">How to load external HTML into a using jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-load-JSON-data-using-jQuery">How to load JSON data using jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-insert-an-element-into-DOM-using-jQuery">How to insert an element into DOM using jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-load-a-page-in-div-using-jQuery">How to load a page in div using jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/How-do-we-upload-external-file-on-a-website-using-HTML-forms">How do we upload external file on a website using HTML forms?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-load-an-HTML-file-into-the-canvas">How to load an HTML file into the canvas?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-jQuery-getScript-method-to-load-external-js-files">How to use jQuery.getScript() method to load external js files?</a></li> <li><a href="https://www.tutorialspoint.com/How-do-I-put-a-jQuery-code-in-an-external-js-file">How do I put a jQuery code in an external .js file?</a></li> <li><a href="https://www.tutorialspoint.com/how-to-create-an-faq-section-of-a-website-using-javascript">How to create an FAQ section of a website using JavaScript?</a></li> <li><a href="https://www.tutorialspoint.com/How-to-use-jQuery-getJSON-to-load-JSON-file-in-jQuery">How to use jQuery.getJSON to load JSON file in jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/jquery-load-with-examples">jQuery load() with Examples</a></li> <li><a href="https://www.tutorialspoint.com/How-to-clone-an-element-using-jQuery">How to clone an element using jQuery?</a></li> <li><a href="https://www.tutorialspoint.com/how-to-load-an-imageview-by-url-on-android-using-picasso">How to load an ImageView by URL on Android using Picasso?</a></li> <li><a href="https://www.tutorialspoint.com/how-to-load-an-image-and-show-the-image-using-keras">How to load an image and show the image using Keras?</a></li> <li><a href="https://www.tutorialspoint.com/how-to-open-external-programs-using-tkinter">How to open External Programs using Tkinter?</a></li> </ul><div class="print-page-logo-img text-center mt-2 mb-2" > <img class="border-0" src="https://www.tutorialspoint.com/articles/images/tp-print-page-logo.png" alt="Tutorials Point" /> </div> <div class="clear"><p></p></div> <div class="d-flex justify-content-between border-top py-2 border-bottom" id="bottom_navigation"> <a href="/articles/index.php" class="pre-btn"><i class="fal fa-chevron-circle-left"></i> Previous Page</a> <a href="https://www.tutorialspoint.com/how-to-load-an-imageview-by-url-on-android-using-picasso" class="nxt-btn">Next Page <i class="fal fa-chevron-circle-right"></i> </a> </div> <input type="hidden" value="13349" id="hdnQUid" /> <input type="hidden" value="jQuery" id="hdnSearchText" /> <input type="hidden" value="How-to-load-external-website-into-an-iframe-using-jQuery" id="hdnQurl" /> <div class="error-success" id="error-success"></div> <div class="error-warning" id="error-warning"></div> <script> var qurl = 'How-to-load-external-website-into-an-iframe-using-jQuery'; </script> <div class="google-bottom-ads" id="google-bottom-ads"> <div>Advertisements</div> <div> <div id="adp_bottom_ads"></div> <script> var adPos = document.getElementById('adp_bottom_ads'); var mobile_ad_id = "6d621d7e-9531-4f26-810f-68af67dc6366"; var desktop_ad_id = "4951d1d6-24d4-4a31-afb7-2c22c489eae1"; var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { var ad_id = window.innerWidth <= 768 ? mobile_ad_id : desktop_ad_id; adPos.innerHTML = '<div id="' + ad_id + '" class="_ap_apex_ad"></div>'; adpushup.triggerAd(ad_id); }); </script> </div> </div> </div>   <div class="col-sm-6 col-md-3 col-xl-3"> <div class="data-sticky" id="google-right-ads"> <div class="google-right-ad" style="margin: 0px auto !important;margin-top:5px;min-height:250px!important"> <div id="f0f6cff6-393d-4170-b63a-d9ff06ca9f25" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("f0f6cff6-393d-4170-b63a-d9ff06ca9f25"); }); } </script> </div> </div> <div class="google-right-ad" style="margin-top:16px;min-height:250px!important"> <div id="5c0affd5-724a-475c-bfcd-cecbc7660c36" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("5c0affd5-724a-475c-bfcd-cecbc7660c36"); }); } </script> </div> </div> <div class="google-right-ad" style="margin-top:16px;margin-bottom:15px;min-height:600px!important"> <div id="8f8814c2-d64c-4d26-9cb9-543653c0b48f" class="_ap_apex_ad"> <script> if( window.innerWidth > 768 ){ var adpushup = adpushup || {}; adpushup.que = adpushup.que || []; adpushup.que.push(function() { adpushup.triggerAd("8f8814c2-d64c-4d26-9cb9-543653c0b48f"); }); } </script> </div> </div>  </div> </div> </div> </div> </main> <footer class="py-3 card navbar-dark border-top" id="footer">  <div class="py-4 bg-white"> <div class="container"> <div class="row g-4">  <div class="col-lg-6 position-relative overflow-hidden"> <a href="https://www.tutorialspoint.com/market/business/subscription.jsp" target="_blank" title="Annual Membership"> <div class="bg-primary bg-opacity-10 rounded-3 p-5 h-100"> <div class="position-absolute bottom-0 end-0 me-3"> <img src="/images/annual-membership-wraps.svg" class="h-100px h-sm-200px" alt=""> </div> <div class="row"> <div class="col-sm-8 position-relative"> <h3 class="mb-1">Annual Membership</h3> <p class="mb-3 h5 fw-light lead">Enjoy unlimited access on 5500+ Hand Picked Quality Video Courses</p> <div class="btn-business mb-0"><i class="fal fa-check"></i> Subscribe Now</div> </div> </div> </div> </a> </div>  <div class="col-lg-6 position-relative overflow-hidden"> <a href="https://www.tutorialspoint.com/business/index.asp#demoRequest" target="_blank" title="Business Pack"> <div class="bg-secondary rounded-3 bg-opacity-10 p-5 h-100"> <div class="position-absolute bottom-0 end-0 me-3"> <img src="/images/business-banner-wraps.svg" class="h-100px h-sm-200px" alt=""> </div> <div class="row"> <div class="col-sm-8 position-relative"> <h3 class="mb-1">Training for a Team</h3> <p class="mb-3 h5 fw-light lead">Affordable solution to train a team and make them project ready.</p> <div class="btn btn-warning mb-0"><i class="fal fa-check me-1"></i> Submit Demo Request</div> </div> </div> </div> </a> </div> </div> </div> </div>  <div class="container"> <div class="row g-4"> <div class="col-lg-12 text-center"> <a class="me-0 pb-4" href="https://www.tutorialspoint.com"> <img class="light-mode-item h-100px" src="/static/images/logo-color-footer.png" alt="Tutorials Point"> <img class="dark-mode-item h-100px" src="/static/images/logo-footer-b.png" alt="Tutorials Point"> </a> <ul class="nav justify-content-center py-3 mt-md-0 "> <li class="nav-item"><a class="nav-link fw-bold" href="/about/index.htm"><i class="fal fa-globe"></i> About us</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/return_refund_policy.htm"> <i class="fal fa-check"></i> Refund Policy</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/about_terms_of_use.htm"><i class="fal fa-check"></i> Terms of use</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/about_privacy.htm"> <i class="fal fa-shield-check"></i> Privacy Policy</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/faq.htm"><i class="fal fa-question-circle"></i> FAQ's</a></li> <li class="nav-item"><a class="nav-link fw-bold" href="/about/contact_us.htm"><i class="fal fa-map-marker-alt"></i> Contact</a></li> </ul> <p class="small">© Copyright 2022. All Rights Reserved.</p> </div> <div id="privacy-banner"> <div> <p>We make use of First and third party cookies to improve our user experience. By using this website, you agree with our Cookies Policy. <a id="banner-accept" href="#">Agree</a> <a id="banner-learn" href="/about/about_cookies.htm" target="_blank">Learn more</a> </p> </div> </div> </div> </div> </footer> <div class="back-top"> <i class="fal fa-angle-up position-absolute top-50 start-50 translate-middle"></i> </div> <script src="/static/js/script-min.js?v=0.12131"></script> <script async src="https://www.googletagmanager.com/gtag/js?id=UA-232293-17"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-232293-17'); </script>  <script async src="https://www.googletagmanager.com/gtag/js?id=AW-664793816"></script> <script> window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'AW-664793816'); </script> </body> </html>