Script tag
To write a JavaScript you need to use script tag <script></script> but is recommended to place in the <head></head> tags of your html document
Hello world in JavaScript
<html>
<body>
<script language = "javascript" type = "text/javascript">
document.write("Hello World!") // use when you like to print content on the Html document
// alert("Hello, World!"); // gives an alert message box with Hello world
</script>
</body>
</html>
Comments in Java Script
<html>
<body>
<script language = "javascript" type = "text/javascript">
//First way to comment
/* Second way to comment*/
<!--Third way to comment -->
</script>
</body>
</html>
<html>
<head>
<script type = "text/javascript">
<!--
function sayHello_world() {
document.write("Hello World!")
}
//-->
/*Some Html input type*/
/*<input type="button">
<input type="checkbox">
<input type="color">
<input type="date">
<input type="datetime-local">
<input type="email">
<input type="file">
<input type="hidden">
<input type="image">
<input type="month">
<input type="number">
<input type="password">
<input type="radio">
<input type="range">
<input type="reset">
<input type="search">
<input type="submit">
<input type="tel">
<input type="text">
<input type="time">
<input type="url">
<input type="week">
*/
</script>
</head>
<body>
<input type = "button" onclick = "sayHello_world()" value = "write hello! world" />
</body>
</html>
Variables
Variable is a box where you can store values the variables in JavaScript can be declared as var or let, and for numbers as a const<!DOCTYPE html>
<html>
<body>
<title>JavaScript Variables</title>
<h2>JavaScript Variables</h2>
<script>
// store input numbers
var num1 = parseInt(prompt('Enter the first number '));
const num2 = parseInt(prompt('Enter the second number '));
//you can declare many variables in one statement.
//var num1=4,num2=4;
//add two numbers
let sum = num1 + num2;
// display the sum
document.write(`The sum of ${num1} and ${num2} is ${sum}`);
</script>
</body>
</html>
JavaScript variables can hold different types of data types such as numbers, strings, and objects
let NUM = 100; // Number
let NAME = "Joy"; // String
let x = {firstName:"Tom", lastName:"Sawyer"}; // Object
The same variable can be used to store the different variable values
var num; // Now num is undefined
num1 = 200; // Now num1 is a variable
num2 = 100; // Now num2 is also a variable
Modify Html elements
In HTML we have the concept called “id”s and the “id”s are a way to reference a specific Html element in your document
document.getElementById("A").innerHTML = "Hello JavaScript!"
Here in the above syntax, the “document” is referring to Html document itself and the method that we use to access the id “A” is called . getElementById(“A”) and we can the change the paragraph tag with help of a property called .innerHTML = “Hello JavaScript!”
<!DOCTYPE html>
<html>
<body>
<p id="A">JavaScript can Can modify the paragraph tag </p>
<button style=background:#00FFFF;border-style: solid #a30003; type="button" onclick='document.getElementById("A").innerHTML = "Hello JavaScript!"'>Click here!</button>
</body>
</html>
JavaScript can Can modify the paragraph tag
Leave a Reply