Showing posts with label javascript. Show all posts
Showing posts with label javascript. Show all posts

JavaScript syntax is the set of rules, how JavaScript programs are constructed.

JavaScript Programs

A computer program is a list of "instructions" to be "executed" by the computer.

In a programming language, these program instructions are called statements.
JavaScript is a programming language.
JavaScript statements are separated by semicolons.

Example

var x = 5;
var y = 6;
var z = x + y;

JavaScript Statements
JavaScript statements are composed of:
Values, Operators, Expressions, Keywords, and Comments.

JavaScript Values
The JavaScript syntax defines two types of values: Fixed values and variable values.
Fixed values are called literals. Variable values are called variables.

JavaScript Keywords

JavaScript keywords are used to identify actions to be performed.

The var keyword tells the browser to create a new variable:
var x = 5 + 6;
var y = x * 10;


JavaScript Comments

Not all JavaScript statements are "executed".
Code after double slashes // or between /* and */ is treated as a comment.
Comments are ignored, and will not be executed:
var x = 5;   // I will be executed
// var x = 6;   I will NOT be executed

Let's test yourself with Khmer-WEB!

JavaScript Syntax

by on 8:37 AM
JavaScript syntax is the set of rules, how JavaScript programs are constructed. JavaScript Programs A computer program is a list of "in...
at No comments:
Labels:

JavaScript does NOT have any built-in print or display functions.

JavaScript Display Possibilities
JavaScript can "display" data in different ways:
  • Writing into an alert box, using window.alert().
  • Writing into the HTML output using document.write().
  • Writing into an HTML element, using inner HTML.
  • Writing into the browser console, using console.log().
  • Using window.alert()
  • You can use an alert box to display data:

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
window.alert(5 + 6);
</script>

</body>
</html>

Using document.write()
For testing purposes, it is convenient to use document.write():

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
document.write(5 + 6);
</script>

</body>
</html>

Using document.write() after an HTML document is fully loaded, will delete all existing HTML:

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<button onclick="document.write(5 + 6)">Try it</button>

</body>
</html>

Using inner HTML
To access an HTML element, JavaScript can use the document.getElementById(id) method.
The id attribute defines the HTML element. The innerHTML property defines the HTML content:

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My First Paragraph</p>

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML = 5 + 6;
</script>

</body>
</html>

Using console.log()
In your browser, you can use the console.log() method to display data.
Activate the browser console with F12, and select "Console" in the menu.

Example

<!DOCTYPE html>
<html>
<body>

<h1>My First Web Page</h1>
<p>My first paragraph.</p>

<script>
console.log(5 + 6);
</script>

</body>
</html>
Let's test yourself with Khmer-WEB!

JavaScript Output

by on 8:21 AM
JavaScript does NOT have any built-in print or display functions. JavaScript Display Possibilities JavaScript can "display" data i...
at No comments:
Labels:

 JavaScript can be placed in the <body> and the <head> sections of an HTML page.
The <script> Tag
In HTML, JavaScript code must be inserted between <script> and </script> tags.

Example

<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>

JavaScript in <head>

In this example, a JavaScript function is placed in the <head> section of an HTML page.
The function is invoked (called) when a button is clicked:

Example

<!DOCTYPE html>
<html>
<head>
<script>
function myFunction() {
    document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try it</button>
</body>
</html>

JavaScript in <body>

In this example, a JavaScript function is placed in the <body> section of an HTML page.
The function is invoked (called) when a button is clicked:

Example

<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

<p id="demo">A Paragraph</p>

<button type="button" onclick="myFunction()">Try it</button>

<script>
function myFunction() {
   document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>

</body>
</html>

JavaScript Where To

by on 7:37 AM
  JavaScript can be placed in the <body> and the <head> sections of an HTML page. The <script> Tag In HTML, JavaScript cod...
at No comments:
Labels:

JavaScript Tutorial:

  • JavaScript is the programming language of HTML and the Web.
  • Programming makes computers do what you want them to do.
  • JavaScript is easy to learn.
  • This tutorial will teach you JavaScript from basic to advanced. 

Why Study JavaScript?

JAVASCRIPT IS ONE OF THE 3 LANGUAGES ALL WEB DEVELOPERS MUST LEARN:

  1. HTML to define the content of web pages
  2. CSS to specify the layout of web pages
  3. JavaScript to program the behavior of web pages

JavaScript Can Change HTML Content

One of many HTML methods is getElementById().
This example uses the method to "find" an HTML element (with id="demo"), and changes the element content (innerHTML) to "Hello JavaScript":

Example

document.getElementById("demo").innerHTML = "Hello JavaScript";

JavaScript Can Change HTML Styles (CSS)

Changing the style of an HTML element, is a variant of changing an HTML attribute: 

Example

document.getElementById("demo").style.fontSize = "25px";

JavaScript Tutorial

by on 6:17 AM
JavaScript Tutorial: JavaScript is the programming language of HTML and the Web. Programming makes computers do what you want them to do. Ja...
at No comments:
Labels: