Getting an HTML H1 value to JavaScript variable?

Javascript Web Development Object Oriented Programming

To get the value of H1 to JavaScript variable, you can use −

document.getElementById().innerHTML.

Let’s say the following is our H1 heading −

<h1 id="demo"> This is the demo program of JavaScript ........</h1>

Now, let’s get the H1 value using the below code −

Example

Live Demo

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initialscale=1.0">
<title>Document</title>
<link rel="stylesheet"href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
<h1 id="demo"> This is the demo program of JavaScript ........</h1>
<script>
   var data=document.getElementById('demo').innerHTML;
   console.log("The data is="+data);
</script>
</body>
</html>

To run the above program, save the file name “anyName.html(index.html)” and right click on the file. Select the option “Open with Live Server” in VS Code editor.

Output

This will produce the following output −

AmitDiwan

Published on 03-Sep-2020 06:23:55

Previous Page Print Page