Dado un documento HTML, la tarea es obtener el documento completo como una string usando JavaScript. Aquí se discuten algunos métodos:
- Método getElementsByTagName()
Este método devuelve un conjunto de todos los elementos del documento con el nombre de etiqueta definido, como un objeto NodeList.
Este objeto representa una colección de Nodes, a los que se accede mediante números de índice. El índice comienza en 0.
Sintaxis:
document.getElementsByTagName(tagname)
- Parámetros:
- nombre de la etiqueta: este parámetro es obligatorio. Especifica el nombre de la etiqueta de los elementos a obtener.
- nombre de la etiqueta: este parámetro es obligatorio. Especifica el nombre de la etiqueta de los elementos a obtener.
- Propiedad HTML DOM innerHTML
Esta propiedad establece/devuelve el contenido HTML (HTML interno) de un elemento.
Sintaxis:- Devuelve la propiedad innerHTML:
- Devuelve la propiedad innerHTML:
HTMLElementObject.innerHTML
- Establezca la propiedad innerHTML:
HTMLElementObject.innerHTML = text
- texto: Especifica el contenido HTML de un elemento.
Ejemplo 1: este ejemplo obtiene el documento completo como una string usando document.documentElement.innerHTML .
html
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript | Get the entire document HTML as a string.
</title>
</head>
<body style="text-align:center;" id="body">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<p id="GFG_UP" style="font-size: 15px; font-weight: bold;">
</p>
<button onclick="GFG_Fun(); ">
click here
</button>
<script>
var up = document.getElementById('GFG_UP');
up.innerHTML = 'Click on the button to convert whole document to string';
function GFG_Fun() {
var string = document.documentElement.innerHTML;
alert(string);
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Ejemplo 2: este ejemplo obtiene el documento completo seleccionando primero los elementos con el nombre de etiqueta ‘HTML’ y seleccionando el primer elemento mediante la indexación mediante document.getElementsByTagName(‘html’)[0].innerHTML .
html
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript | Get the entire document HTML as a string.
</title>
</head>
<body style="text-align:center;" id="body">
<h1 style="color:green;">
GeeksforGeeks
</h1>
<p id="GFG_UP" style="font-size: 15px; font-weight: bold;">
</p>
<button onclick="GFG_Fun(); ">
click here
</button>
<script>
var up = document.getElementById('GFG_UP');
up.innerHTML = 'Click on the button to convert whole document to string';
function GFG_Fun() {
var string = document.getElementsByTagName('html')[0].innerHTML;
alert(string);
}
</script>
</body>
</html>
Producción:
- Antes de hacer clic en el botón:
- Después de hacer clic en el botón:
Navegadores compatibles:
- Google Chrome
- Mozilla Firefox
- explorador de Internet
- Safari
- Ópera
Publicación traducida automáticamente
Artículo escrito por PranchalKatiyar y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA