Singhak/index.html

## index.html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div id="innertext"></div>
    <div id="innerhtml"></div>
    <div id="textcontent"></div>
    <br>
    <div id="innertext_v"> I am innertext <span hidden>Do't hide me</span><strong>BOLD</strong></div>
    <div id="innerhtml_v">I am innerhtml <span hidden>Do't hide me</span><strong>BOLD</strong></div>
    <div id="textcontent_v">I am textcontent <span hidden>Do't hide me</span><strong>BOLD</strong></div>
    <script src="practice.js"></script>
</body>
</html>

## practice.js
// When we use innerText then any htm tag will not render
const innertext = document.getElementById('innertext');
innertext.innerText = '<strong>Hello, World!</strong>';

// When we use innerHTML then any htm tag will render
const innerhtml = document.getElementById('innerhtml');
innerhtml.innerHTML = '<strong>Hello, World!</strong>';

// When we use textContent then any htm tag will not render
const textcontent = document.getElementById('textcontent');
textcontent.textContent = '<strong>Hello, World!</strong>';


// Interneting difference in innerText and textcontent is while we try to get content


const innertext_v = document.getElementById('innertext_v');
console.log(innertext_v.innerText);
// I am innertext BOLD


const innerhtml_v = document.getElementById('innerhtml_v');
console.log(innerhtml_v.innerHTML);
// I am innerhtml <span hidden="">Do't hide me</span><strong>BOLD</strong>

// When we use textContent then any htm tag will not render
const textcontent_v = document.getElementById('textcontent_v');
console.log(textcontent_v.textContent);
// I am textcontent Do't hide meBOLD
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	</head>
	<body>
	<div id="innertext"></div>
	<div id="innerhtml"></div>
	<div id="textcontent"></div>
	<br>
	<div id="innertext_v"> I am innertext <span hidden>Do't hide me</span><strong>BOLD</strong></div>
	<div id="innerhtml_v">I am innerhtml <span hidden>Do't hide me</span><strong>BOLD</strong></div>
	<div id="textcontent_v">I am textcontent <span hidden>Do't hide me</span><strong>BOLD</strong></div>
	<script src="practice.js"></script>
	</body>
	</html>
	// When we use innerText then any htm tag will not render
	const innertext = document.getElementById('innertext');
	innertext.innerText = '<strong>Hello, World!</strong>';

	// When we use innerHTML then any htm tag will render
	const innerhtml = document.getElementById('innerhtml');
	innerhtml.innerHTML = '<strong>Hello, World!</strong>';

	// When we use textContent then any htm tag will not render
	const textcontent = document.getElementById('textcontent');
	textcontent.textContent = '<strong>Hello, World!</strong>';


	// Interneting difference in innerText and textcontent is while we try to get content


	const innertext_v = document.getElementById('innertext_v');
	console.log(innertext_v.innerText);
	// I am innertext BOLD


	const innerhtml_v = document.getElementById('innerhtml_v');
	console.log(innerhtml_v.innerHTML);
	// I am innerhtml <span hidden="">Do't hide me</span><strong>BOLD</strong>

	// When we use textContent then any htm tag will not render
	const textcontent_v = document.getElementById('textcontent_v');
	console.log(textcontent_v.textContent);
	// I am textcontent Do't hide meBOLD