1

I have a button that loads a page with window.open();

Instead of loading the page, is it possible to get the html from the page without opening it?

TemporaryFix
  • 2,008
  • 3
  • 30
  • 54

4 Answers4

1

Using ajax and jQuery:

$.get( "myNewPage.html", function( data ) {
  $( "#myNewPage" ).html( data );
});
Oliboy50
  • 2,661
  • 3
  • 27
  • 36
  • @ZacharyWeixelbaum This answer already assumed that the OP is familiar with `jQuery` because I use `jQuery.get` method which is part of `jQuery`... if he's familiar with `jQuery`, he'll easily understand that my sample code requires an HTML tag identified by `myNewPage` to be parts of the DOM. – Oliboy50 Jul 02 '15 at 16:32
  • Can you sub the myNewPage.html with a url? – TemporaryFix Jul 02 '15 at 16:45
  • It doesn't seem to work with external urls that are not on the server. Thank you for the suggestion though. – TemporaryFix Jul 02 '15 at 17:17
  • @Programatic If you're talking about external urls, then you'll have to be sure that the site you're trying to reach send you back the proper HTTP Header in its response as described here : http://stackoverflow.com/a/10636765/1905446 To sum up, if you're not the owner of this external url, this is gonna be complicated. – Oliboy50 Jul 02 '15 at 18:31
  • Maybe you'll want to use the ` – Oliboy50 Jul 02 '15 at 18:36
1

As the others have said, AJAX (Asynchronous JavaScript And XML) is the way to go. Libraries like jQuery provide an easy to use way of doing this. Outside of the libraries, JavaScript has a XMLHttpRequest object that you can use to do this same thing.

The idea is make a request to a page, and return the markup on that page in some callback then do what you wish with that markup.

Here is an example:

var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange = function(){
  if(xmlhttp.readyState==4 && xmlhttp.status==200) {
    // the ajax request is done, and the server responded with the html page
    // log the result from the ajax request
    console.log(xmlhttp.responseText);
  }
}
xmlhttp.open("GET","myPage.html",true);
xmlhttp.send();

EDIT

If you own both domains, the one making the request, and the one being requested, then you can use CORS. This will tell the other server to allow requests from the first domain.

If you don't own both domains, or have access to both sides, then this becomes a lot more difficult. You can either make an HTTP request from your server side, or check out some other answers on here

Community
  • 1
  • 1
jeremywoertink
  • 2,281
  • 1
  • 23
  • 29
  • How could I do this with a url to a different page? I read up on xmlhttp requests and they do not support Access Across Domains – TemporaryFix Jul 02 '15 at 16:43
  • I've updated my answer to explain a little more for that. If you're accessing a different server, then things become slightly more difficult, but not impossible. – jeremywoertink Jul 02 '15 at 17:06
0

You may want to look into AJAX-Requests: https://developer.mozilla.org/de/docs/AJAX

Johannes Reuter
  • 3,501
  • 19
  • 20
0

Please use the jquery load method.

According to the docs,

This method is the simplest way to fetch data from the server. It is roughly equivalent to $.get(url, data, success) except that it is a method rather than global function and it has an implicit callback function. When a successful response is detected (i.e. when textStatus is "success" or "notmodified"), .load() sets the HTML contents of the matched element to the returned data. This means that most uses of the method can be quite simple.

.load( url [, data ] [, complete ] )

url Type: String; A string containing the URL to which the request is sent.

data Type: PlainObject or String; A plain object or string that is sent to the server with the request.

complete Type: Function( String responseText, String textStatus, jqXHR jqXHR ); A callback function that is executed when the request completes.

Ref: Click Here for jquery documentation : Another Stack overflow question on the same lines

Community
  • 1
  • 1
K3V
  • 282
  • 6
  • 17