Scribd
Upload
71 views

Online Live Class Web Engineering: Course Name

This 3-sentence summary provides an overview of the key points from the document: The document discusses JavaScript, describing it as a scripting language that allows adding interactive behavior to web pages. It explains different ways JavaScript code can be inserted and placed, such as between HTML tags or in an external .js file. Various methods for outputting data with JavaScript are also covered, including using document.write(), window.alert(), and changing an element's innerHTML.

Uploaded by

meharab
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
71 views

Online Live Class Web Engineering: Course Name

This 3-sentence summary provides an overview of the key points from the document: The document discusses JavaScript, describing it as a scripting language that allows adding interactive behavior to web pages. It explains different ways JavaScript code can be inserted and placed, such as between HTML tags or in an external .js file. Various methods for outputting data with JavaScript are also covered, including using document.write(), window.alert(), and changing an element's innerHTML.

Uploaded by

meharab
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 21

Online Live Class

Course name:
Web Engineering

Presented by
Shirin Aktar
Lecturer, Dept. of CSE
Dhaka City College

1
Chapter-4

2
JavaScript

 JavaScript is a Scripting Language .


 JavaScript is a scripting or programming language
that allows you to implement complex features on
web pages .
 Invented in 1995 at Netscape Corporation (LiveScript)
 All modern HTML pages are using JavaScript .

3
Why use javascript

 Adding interactive behavior to web pages


 Creating web and mobile apps.
 JavaScript gives HTML designers a programming tool .
 JavaScript can dynamically modify an HTML page .
 JavaScript can react to user input .
 JavaScript can validate user input .
 JavaScript can be used to create cookies .

4
Scripting Language
 All scripting languages are programming languages. The
scripting language is basically a language where
instructions are written for a run time environment.

 Scripting languages can be divided into two categories:


1) Server-Side Scripting Languages
2) Client-Side Scripting Languages

5
Server-side script

 Executed by the web server only when a user requests a


document.
 Then a document is sent to the user’s computer.
 Complete all processing in the server and send plain pages
to the client.
 Example: Perl, PHP and Python .

6
Client-side script

 When client makes the request the HTML and all


scripts will be downloaded into your browser and
then the resulted HTML will be displayed in the
browser is called client-side script.
 Example: JavaScript, VBScript.

7
Example

8
JavaScript Statement
JavaScript can be inserted into document by using the Script tag.

<html>
Tells where the JavaScript starts
<body>
<script type =“text/javascript” >
document.write(“Hello World!”);
</script> Commands for writing output to a page
</body>
Tells where the JavaScript ends
</html> 9
Places to put JavaScript code

1. Between the body tag of html.


2. Between the head tag of html.
3. In .js file (external JavaScript)

10
Between the body tag

<html>
<body>
<script type =“text/javascript” >
document.write(“Hello World!”);
</script>
</body>
</html>

11
Internal JavaScript
<html>
<head>
<script>
………JavaScript code ……..
</script>
</head>
<body>
………code ……..
</body>

</html>
12
External JavaScript File

<html>

<head>
<script type=“text/javascript” src=“filename.js”>
</script>
</head>
<body>
</body>
</html>

13
External JavaScript File (Cont.)

 Let's create an external JavaScript file that prints Hello Javatpoint in a alert


dialog box.
 message.js
function msg(){   <html>  
 alert("Hello Javatpoint");   <head>  
}   <script type="text/javascript" src="message.js"></sc
ript>  
 Let's include the JavaScript file </head>  
<body>  
into html page. <p>Welcome to JavaScript</p>  
<form>  
 It calls the JavaScript function on <input type="button" value="click" onclick="msg()"/> 
button click.  
</form>  
 index.html </body>   14

</html>  
JavaScript Output

JavaScript can "display" data in different ways:

Writing into an HTML element, using innerHTML.


Writing into the HTML output using document.write().
Writing into an alert box, using window.alert().

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

16
Using window.alert()

17
Using innerHTML

One of many JavaScript 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"

18
Using innerHTML(Cont.)

19
Using innerHTML(cont.)

20
Thank you

21

You might also like