Collect body external url javascript and load it html

Question

Collect body external url javascript and load it html

Navigation

#1 by (3 votes)
#2 by (0 votes)
#3 by (0 votes)

0

Dear colleagues:

I am sending this question in case someone would answer it. I have an external url (index4.html) in html that I would like to remove the body from and upload it to my current html page. I currently have this code in (index2.html):

<html>
<head>
<script type="text/javascript">

function makeHttpObject() {

  try {return new XMLHttpRequest();}
  catch (error) {}
  try {return new ActiveXObject("Msxml2.XMLHTTP");}
  catch (error) {}
  try {return new ActiveXObject("Microsoft.XMLHTTP");}
  catch (error) {}

  throw new Error("Could not create HTTP request object.");
}
var request = makeHttpObject();
request.open("GET", "index4.html", true);
request.send(null);
request.onreadystatechange = function() {
  if (request.readyState == 4)
  var cosa = request.responseText;
  var iFrameBody = cosa.getElementsByTagName('body')[0];
    alert(iFrameBody);

};

</script>
</head>
<body>


</body>
</html>

Code index4.html:

<html>
<head>
</head>
<body>
Hello world!!
</body>
<html>

But I can not get an alert, let alone load it in the body.

If someone answered, I am grateful in advance. S @ | u2

javascript html5

asked by akenateb 17.12.2016 в 12:03

source

3 answers

0

In the end what I got with this code (I leave it in case someone else could help you):

<html>
<head>
<script type="text/javascript">
function getFrameContents()
{
	var iFrame =  document.getElementById('ifpaginaIframe');
	var iFrameBody;
	if ( iFrame.contentDocument )
	{ // FF
		iFrameBody = iFrame.contentDocument.getElementsByTagName('body')[0];
	}
	else if ( iFrame.contentWindow )
	{ // IE
		iFrameBody = iFrame.contentWindow.document.getElementsByTagName('body')[0];
	}
 
	alert(iFrameBody.innerHTML);
	
}
</script>
</head>
<body onload=getFrameContents();>
<iframe name="paginaIframe" id='ifpaginaIframe' src="index2.html" frameborder=0 width=0 height=0 scrolling="no"></iframe>
</body>
</html>

but he does not interpret the content, he just loads it:

<p>Hello World</p>

It looks like this, just like that. Now to see if I can interpret it. Thanks for the reply. S @ | u2

answered by 17.12.2016 в 13:39

0

Thanks to Marco I have a functional answer:

<!DOCTYPE html>
<html>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<head>
<script type="text/javascript">
function makeHttpObject()  {
  if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+ ...
    return new XMLHttpRequest();
  }
  throw new Error("Could not create HTTP request object.");
}

var request = makeHttpObject();
request.open("GET", "http://127.0.0.1/sql/index2.html", true);
request.send(null);
request.onreadystatechange = function() {

  // Si se establecion correctamente la conexion
  if (request.readyState === XMLHttpRequest.DONE) {

    // Si la respuesta es exitosa
    if (request.status === 200) {

      // Creamos un nuevo "Document"
      var doc = document.implementation.createHTMLDocument("doc");
      // Inyectamos el texto html recibido
      doc.documentElement.innerHTML = request.responseText;
		alert(request.responseText);
      // Reemplazamos el body actual por el nuevo.
      document.body.innerHTML = doc.body.innerHTML;
    }
  }
};
</script>
</head>
<body>
</body>
</html>

Greetings and muxas thank you all!

answered by 17.12.2016 в 14:17

Show plurals on Android Problem with functions - Find item in a fix

score 3 · Accepted Answer

In your index2.html , I can see the following errors:

In if (request.readyState == 4) , you are not using braces ( {} ), so you should be receiving an error that says cosa is undefined .
You are not validating the server's response correctly . That is, you need to see that request.status is successful ( 200 ).
cosa is not an object, it is plain text.

To be able to extract the body of texto that is received after the ajax call, we can use document.implementation.createHTMLDocument ( IE9+ )

The final code could be something like this:

function makeHttpObject()  {
  if (window.XMLHttpRequest) { // Mozilla, Safari, IE7+ ...
    return new XMLHttpRequest();
  }
  throw new Error("Could not create HTTP request object.");
}

var request = makeHttpObject();
request.open("GET", "index4.html", true);
request.send(null);
request.onreadystatechange = function() {

  // Si se establecion correctamente la conexion
  if (request.readyState === XMLHttpRequest.DONE) {

    // Si la respuesta es exitosa
    if (request.status === 200) {

      // Creamos un nuevo "Document"
      var doc = document.implementation.createHTMLDocument("doc");
      // Inyectamos el texto html recibido
      doc.documentElement.innerHTML = request.responseText;

      // Reemplazamos el body actual por el nuevo.
      document.body.innerHTML = doc.body.innerHTML;
    }
  }
};