Full version: jsB@nk » Ajax » AJAX Net Page Fetcher
URL: https://www.javascriptbank.com/ajax-net-page-fetcher.html
This AJAX playscript allows you make page read on other page's content (both asks to be from the same web site - avoid security issues) and show them on require inside the current user page. You can further assign any external .js or .css files that should be loaded at the same time as the external page, because AJAX fetched pages often will be not load these files correctly equally they come out within the page's source.
Full version: jsB@nk » Ajax » AJAX Net Page Fetcher
URL: https://www.javascriptbank.com/ajax-net-page-fetcher.html
<script type="text/javascript" name="ajaxpagefetcher.js">/************************************************ Ajax Page Fetcher- by JavaScript Kit (www.javascriptkit.com)***********************************************/var ajaxpagefetcher={loadingmessage: "Loading Page, please wait...",exfilesadded: "",connect:function(containerid, pageurl, bustcache, jsfiles, cssfiles){var page_request = falsevar bustcacheparameter=""if (window.XMLHttpRequest) // if Mozilla, IE7, Safari etcpage_request = new XMLHttpRequest()else if (window.ActiveXObject){ // if IE6 or belowtry {page_request = new ActiveXObject("Msxml2.XMLHTTP")} catch (e){try{page_request = new ActiveXObject("Microsoft.XMLHTTP")}catch (e){}}}elsereturn falsevar ajaxfriendlyurl=pageurl.replace(/^http://[^/]+//i, "http://"+window.location.hostname+"/") page_request.onreadystatechange=function(){ajaxpagefetcher.loadpage(page_request, containerid, pageurl, jsfiles, cssfiles)}if (bustcache) //if bust caching of external pagebustcacheparameter=(ajaxfriendlyurl.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date().getTime()document.getElementById(containerid).innerHTML=ajaxpagefetcher.loadingmessage //Display "fetching page message"page_request.open('GET', ajaxfriendlyurl+bustcacheparameter, true)page_request.send(null)},loadpage:function(page_request, containerid, pageurl, jsfiles, cssfiles){if (page_request.readyState == 4 && (page_request.status==200 || window.location.href.indexOf("http")==-1)){document.getElementById(containerid).innerHTML=page_request.responseTextfor (var i=0; i<jsfiles.length; i++)this.loadjscssfile(jsfiles[i], "js")for (var i=0; i<cssfiles.length; i++)this.loadjscssfile(cssfiles[i], "css")this.pageloadaction(pageurl) //invoke custom "onpageload" event}},createjscssfile:function(filename, filetype){if (filetype=="js"){ //if filename is a external JavaScript filevar fileref=document.createElement('script')fileref.setAttribute("type","text/javascript")fileref.setAttribute("src", filename)}else if (filetype=="css"){ //if filename is an external CSS filevar fileref=document.createElement("link")fileref.setAttribute("rel", "stylesheet")fileref.setAttribute("type", "text/css")fileref.setAttribute("href", filename)}return fileref},loadjscssfile:function(filename, filetype){ //load or replace (if already exists) external .js and .css filesif (this.exfilesadded.indexOf("["+filename+"]")==-1){ //if desired file to load hasnt already been loadedvar newelement=this.createjscssfile(filename, filetype)document.getElementsByTagName("head")[0].appendChild(newelement)this.exfilesadded+="["+filename+"]" //remember this file as being added}else{ //if file has been loaded already (replace/ refresh it) var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none" //determine element type to create nodelist using var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none" //determine corresponding attribute to test for var allsuspects=document.getElementsByTagName(targetelement) for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1){ var newelement=this.createjscssfile(filename, filetype) allsuspects[i].parentNode.replaceChild(newelement, allsuspects[i]) }} }},pageloadaction:function(pageurl){this.onpageload(pageurl) //call customize onpageload() function when an ajax page is fetched/ loaded},onpageload:function(pageurl){ //do nothing by default},load:function(containerid, pageurl, bustcache, jsfiles, cssfiles){var jsfiles=(typeof jsfiles=="undefined" || jsfiles=="")? [] : jsfilesvar cssfiles=(typeof cssfiles=="undefined" || cssfiles=="")? [] : cssfilesthis.connect(containerid, pageurl, bustcache, jsfiles, cssfiles)}} //End object//Sample usage://1) ajaxpagefetcher.load("mydiv", "content.htm", true)//2) ajaxpagefetcher.load("mydiv2", "content.htm", true, ["external.js"])//3) ajaxpagefetcher.load("mydiv2", "content.htm", true, ["external.js"], ["external.css"])//4) ajaxpagefetcher.load("mydiv2", "content.htm", true, ["external.js", "external2.js"])//5) ajaxpagefetcher.load("mydiv2", "content.htm", true, "", ["external.css", "external2.css"])</script><script type="text/javascript">// Fetch and display "content.htm" inside a DIV automatically as the page loads:ajaxpagefetcher.load("joe", "content.htm", true)</script><div id="bob"></div><script type="text/javascript"><!-- Fetch and display "sub/content2.htm" inside a DIV when a link is clicked on. Also load one .css file--><a href="javascript:ajaxpagefetcher.load('bob', 'sub/content2.htm', false, '', ['page.css'])">Load Content 2</a></script>