Creé una tarjeta de actualización de función (elemento, nombre, rol, biografía), que toma una identificación de elemento para actualizar, nombre, rol y biografía como cadenas y cambia el contenido en la pantalla. El código HTML + javscript completo es:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equiv="X-UA-Compatible" content="ie=edge" /> <title>DOM</title> </head> <body> <section id="card"> <h1>New Student</h1> <h3>Role</h3> <p>Bio Text Goes Here</p> </section> <script src="./index.js"> function updateCard(elem, name, role, bio) { const card = document.getElementById(elem); const head = document.getElementsByTagName("h1"); head.textContent = name; } updateCard("card", "shantanu", "engineer", "just a normal person"); </script> </body> </html>getElementsByTagName devuelve una matriz.
Deberías hacerlo así: head[0].textContent = name;
getElementsByTagName devuelve una matriz como en el nombre ELEMENTS .
solo haz head[0].innerHTML . Funcionará.
Más información aquí:
El método getElementsByTagName() devuelve una colección de elementos secundarios de un elemento con el nombre de etiqueta especificado, como un objeto NodeList.
https://www.w3schools.com/jsref/met_element_getelementsbytagname.asp
getElementsByTagName devuelve una matriz, debe apuntar al primer elemento de la matriz para actualizar el valor como se describe a continuación. Del mismo modo, puede actualizar el resto de los valores. Se agrega el ejemplo de trabajo completo.
head[0].textContent = name;Código de trabajo
function updateCard(elem, name, role, bio) { const card = document.getElementById(elem); const head = document.getElementsByTagName("h1"); const roleTag = document.getElementsByTagName("h3"); const bioTag = document.getElementsByTagName("p"); head[0].textContent = name; roleTag[0].textContent = role; bioTag[0].textContent = bio; } updateCard("card", "shantanu", "engineer", "just a normal person"); <section id="card"> <h1>New Student</h1> <h3>Role</h3> <p>Bio Text Goes Here</p> </section>