jsBasic/01.introduction.html at master · amanullah01/jsBasic · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html>
<html>
<head>
	<title>Js Introduction</title>
</head>
<body>
	<h1>JS Introduction</h1>
	<p id="demo">JS can change HTML Contents</p>
	<button type="button" onclick="document.getElementById('demo').innerHTML='Hello JS'">Click me</button>
	<hr>
	<h2>JS can change HTML Attributes</h2>
	<button type="button" onclick="document.getElementById('bulb').src='pic_bulbon.gif'">Light On</button>
	<img id="bulb" src="pic_bulboff.gif">
	<button type="button" onclick="document.getElementById('bulb').src='pic_bulboff.gif'">Light Off</button>
	<hr>
	<h2>JS Can change HTML Styles CSS</h2>
	<p id="design">JS Can change html styles css</p>
	<button type="button" onclick="document.getElementById('design').style.fontSize='25px'">Change</button>

	<hr>
	<h2>JS can show hidden html elements</h2>
	<p id="show" style="display: none;">Hello JS</p>
	<button type="button" onclick="document.getElementById('show').style.display='block'">Show</button>
	<button type="button" onclick="document.getElementById('show').style.display='none'">Hide</button>
</body>
</html>