1

Estoy realizando un código para mostrar por pantalla diversa información pero éste me falla. También debo utilizar innerHTML creando un nodo.

El código es el siguiente:

window.onload = function() {
  var info = document.getElementById("informacion");

  // Numero de enlaces de la pagina
  var enlaces = document.getElementsByTagName("a");


  // Direccion del penultimo enlace
  var mensaje = "El penultimo enlace apunta a: " + enlaces[enlaces.length].href


  // Numero de enlaces del tercer párrafo
  var parrafos = document.getElementsByTagName("p");
  enlaces = parrafos[2].getElementsByTagName("a");
}
<!DOCTYPE html>
<html>

<head>
  <title>Ejercicio 17</title>
</head>

<body>
  <script src="index.js"></script>
  <h1>DOM</h1>
  <h2>Crear mapas</h2>
  <p>Cree mapas interactivos que expliquen sus datos y animen a los usuarios a explorarlos. Cree un mapa de sus propios datos y gane perspectiva agregando los datos acreditados basados en ubicación incluidos en ArcGIS Online. Utilice la representación cartográfica
    inteligente para guiar la exploración y la visualización de los datos.
    <a href="https://www.esri.com/es-es/arcgis/products/arcgis-online/capabilities/make-maps">Información sobre creación de mapas</a>
  </p>

  <h2>Herramientas para desarrolladores</h2>
  <p>Todas las capacidades de ArcGIS Online están disponibles a través de diversas API y SDK. Los desarrolladores pueden empezar su trabajo aprovechando los mapas, análisis y estilos creados por sus compañeros del ámbito de la representación cartográfica.
    Amplíe y personalice elementos de ArcGIS Online y desarrolle aplicaciones personalizadas con las herramientas de desarrollador.
    <a href="https://www.esri.com/en-us/arcgis/products/arcgis-for-developers/overview">Explorar ArcGIS for Developers</a>
  </p>

  <h2>Operaciones de campo</h2>
  <p id="third-paragraph">Conecte operaciones de campo y oficina con datos compartidos. Cree datos, mapas y aplicaciones para su referencia o uso por parte del personal de campo para fines de captura de datos. Utilice <a href="https://doc.arcgis.com/es/collector/android/create-maps/offline-map-prep.htm">mapas sin conexión</a>    y sincronice cuando vuelva a conectarse. Los datos capturados pasan a formar parte de ArcGIS Online para utilizarlos en aplicaciones y cuadros de mando.
    <a href="https://www.esri.com/en-us/arcgis/products/field-operations/overview">Explorar operaciones de campo</a>
  </p>

  <p>
    <a href="https://geonet.esri.com/welcome">Geonet</a> es el lugar donde puedes compartir, chatear y colaborar con todo tipo de recursos geo.
  </p>

  <p>
    <a href="http://mappingcenter.esri.com">Mapping Center</a> es el sitio destinado a ayudar a crear mapas con ArcGIS.
  </p>
</body>

</html>

Estoy un poco encallado en este punto. No sé como continuar. Entiendo que la solución debe ser sencilla pero ahora no encuentro ninguna.

2
  • agrega tu html, que nodo necesitas crear? donde? agrega mas detalles a tu pregunta Commented el 4 feb. 2023 a las 16:45
  • Buen día, podrías decirnos que es lo que quieres lograr con tu código? qué problemas tienes? cual es lo que te falla?... danos más detalles. Commented el 4 feb. 2023 a las 17:08

1 respuesta 1

0

Te falla por varias razones.

Estás tratando de obtener un elemento con id informacion el cual no existe. Para el ejemplo lo creé al final.

En la pregunta mencionas que debes crear un nodo, o lo que es lo mismo, un nuevo elemento HTML. También te dejé un ejemplo agregando un span en el párrafo nuevo.

Revisa el snippet en pantalla completa para que veas el ejemplo con el nuevo párrafo al final.

Los demás hallazgos los dejé comentados en el código. Si tienes dudas adicionales, deja un comentario.

window.onload = function() {
  //Capturar el elemento con id informacion (último párrafo)
  var info = document.getElementById("informacion");
  //Mostrar en consola el contenido del párrafo
  console.log(info.innerHTML);
  //Crear un nuevo nodo, en este caso un span
  var nodo = "<span style='color: red;'> Crear un span dentro del párrafo con id <b>informacion</b></span>"
  //Agregar el nuevo nodo al último párrafo
  info.innerHTML += nodo;

  // Numero de enlaces de la pagina
  var enlaces = document.getElementsByTagName("a");
  console.log("Cantidad de enlaces: " + enlaces.length);

  //El penúltimo debe ser length - 2 ya que los array inician en cero y length inicia en 1
  var penultimo = (enlaces.length - 2);
  
  // Direccion del penúltimo enlace
  var mensaje = "El penultimo enlace apunta a: " + enlaces[penultimo].href;
  console.log(mensaje);

  // Numero de enlaces del tercer párrafo
  //Obtener los párrafos
  var parrafos = document.getElementsByTagName("p");
  //Obtener los enlaces del párrafo 3 que en el array viene siendo la posición 2
  var cantidadEnlaces = parrafos[2].getElementsByTagName("a");
  console.log("La cantidad de enlaces del terecer párrafo es: " + cantidadEnlaces.length);
}
<!DOCTYPE html>
<html>

<head>
  <title>Ejercicio 17</title>
</head>

<body>
  <script src="index.js"></script>
  <h1>DOM</h1>
  <h2>Crear mapas</h2>
  <p>Cree mapas interactivos que expliquen sus datos y animen a los usuarios a explorarlos. Cree un mapa de sus propios datos y gane perspectiva agregando los datos acreditados basados en ubicación incluidos en ArcGIS Online. Utilice la representación cartográfica
    inteligente para guiar la exploración y la visualización de los datos.
    <a href="https://www.esri.com/es-es/arcgis/products/arcgis-online/capabilities/make-maps">Información sobre creación de mapas</a>
  </p>

  <h2>Herramientas para desarrolladores</h2>
  <p>Todas las capacidades de ArcGIS Online están disponibles a través de diversas API y SDK. Los desarrolladores pueden empezar su trabajo aprovechando los mapas, análisis y estilos creados por sus compañeros del ámbito de la representación cartográfica.
    Amplíe y personalice elementos de ArcGIS Online y desarrolle aplicaciones personalizadas con las herramientas de desarrollador.
    <a href="https://www.esri.com/en-us/arcgis/products/arcgis-for-developers/overview">Explorar ArcGIS for Developers</a>
  </p>

  <h2>Operaciones de campo</h2>
  <p id="third-paragraph">Conecte operaciones de campo y oficina con datos compartidos. Cree datos, mapas y aplicaciones para su referencia o uso por parte del personal de campo para fines de captura de datos. Utilice <a href="https://doc.arcgis.com/es/collector/android/create-maps/offline-map-prep.htm">mapas sin conexión</a>    y sincronice cuando vuelva a conectarse. Los datos capturados pasan a formar parte de ArcGIS Online para utilizarlos en aplicaciones y cuadros de mando.
    <a href="https://www.esri.com/en-us/arcgis/products/field-operations/overview">Explorar operaciones de campo</a>
  </p>

  <p>
    <a href="https://geonet.esri.com/welcome">Geonet</a> es el lugar donde puedes compartir, chatear y colaborar con todo tipo de recursos geo.
  </p>

  <p>
    <a href="http://mappingcenter.esri.com">Mapping Center</a> es el sitio destinado a ayudar a crear mapas con ArcGIS.
  </p>
  <p id="informacion">Mostrar este texto en consola</p>
</body>

</html>

0

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.