Use JavaScript to write HTML element attribute text into HTML element

user_19303201 0
Viewed 57

How do I target message using JavaScript here to write to the tag? Here is my HTML code:

<h1 message = "this is the title of the page"></h1>

The message should only show in certain circumstances. Just wondering how I would use JavaScript to grab that element and inject its contents into the h1 tag when needed?

html javascript
2 Answers

You could do it as below. Feel free to adapt it to your use case, as for now, it will write into the <h1> as soon as the script is loaded and gets executed.

const h1 = document.querySelector("h1");
h1.textContent = h1.getAttribute("message");
<h1 message = "this is the title of the page"></h1>

user_152886410

getAttribute method is used to get the value of any attribute in html tag.

Syntax of using getAttribute

element.getAttribute (attributename); 

const target = document.querySelector("h1");
// Original attribute
console.log(target.getAttribute("message"))
<h1 message="I am message in h1 tag"></h1>

setAttribute method is used to set the value of any attribute in html tag.

Syntax of using setAttribute

element.setAttribute(attributename, attributevalue);

const target = document.querySelector("h1");
// Original attribute
console.log(target.getAttribute("message"))

// changed attribute
target.setAttribute("message","message attribute changed") 
console.log(target.getAttribute("message"))
<h1 message = "this is the title of the page"></h1>https://stackoverflow.com/questions/72569107/use-javascript-to-write-text-into-html-interface#

user_151162070
Related