SlideShare a Scribd company logo
1 of 23
JavaScript
Where to place JavaScript
• There is a flexibility given to include JavaScript
code anywhere in an HTML document.
• However the most preferred ways to include
JavaScript in an HTML file are as follows:
– Script in <head>...</head> section.
– Script in <body>...</body> section.
– Script in <body>...</body> and <head>...</head>
sections.
– Script in an external file and then include in
<head>...</head> section.
JavaScript in <head>...</head> Section
• If you want to have a script run on some event, such as when a user clicks
somewhere, then you will place that script in the head as follows:
<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
Click here for the result
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>
JavaScript in <body>...</body> Section
• If you need a script to run as the page loads so
that the script generates content in the page,
then the script goes in the <body> portion of
the document.
• In this case, you would not have any function
defined using JavaScript.
• Take a look at the following code.
Example
<html>
<head>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<p>This is web page body </p>
</body>
</html>
Output
JavaScript in <body> and <head> Sections
• You can put your JavaScript code in <head> and <body> section altogether as follows:
<html>
<head>
<script type="text/javascript">
<!--
function sayHello() {
alert("Hello World")
}
//-->
</script>
</head>
<body>
<script type="text/javascript">
<!--
document.write("Hello World")
//-->
</script>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>
Output
JavaScript in External File
• As you begin to work more extensively with
JavaScript, you will be likely to find that there
are cases where you are reusing identical
JavaScript code on multiple pages of a site.
• You are not restricted to be maintaining
identical code in multiple HTML files.
• The script tag provides a mechanism to allow
you to store JavaScript in an external file and
then include it into your HTML files.
Example
<html>
<head>
<script type="text/javascript" src="filename.js" ></script>
</head>
<body>
<input type="button" onclick="sayHello()" value="Say Hello" />
</body>
</html>
• To use JavaScript from an external file source, you need to write all
your JavaScript source code in a simple text file with the extension
".js"
• Then include that file as shown above.
External Javascript
• filename.js
function sayHello() {
alert("Hello World")
}
Output
JavaScript Datatypes
• One of the most fundamental characteristics of a
programming language is the set of data types it supports.
• These are the type of values that can be represented and
manipulated in a programming language.
• JavaScript allows you to work with three primitive data
types:
– Numbers, e.g., 123, 120.50 etc.
– Strings of text, e.g. "This text string" etc.
– Boolean, e.g. true or false.
• JavaScript also defines two trivial data types, null and
undefined, each of which defines only a single value.
• In addition to these primitive data types, JavaScript
supports a composite data type known as object.
JavaScript Variables
• Like many other programming languages,
JavaScript has variables.
• Variables can be thought of as named containers.
• You can place data into these containers and then
refer to the data simply by naming the container.
• Before you use a variable in a JavaScript program,
you must declare it.
• Variables are declared with the var keyword as
follows.
Example
<script type="text/javascript">
<!--
var money;
var name;
//-->
</script>
You can also declare multiple variables with the same var keyword as
follows:
<script type="text/javascript">
<!--
var money, name;
//-->
</script>
Initialization
• Storing a value in a variable is called variable
initialization.
• You can do variable initialization at the time of
variable creation or at a later point in time when
you need that variable.
• For instance, you might create a variable named
money and assign the value 2000.50 to it later.
• For another variable, you can assign a value at
the time of initialization as follows
Example
<script type="text/javascript">
<!--
var name = "Ali";
var money;
money = 2000.50;
//-->
</script>
JavaScript Variable Scope
• The scope of a variable is the region of your program in
which it is defined. JavaScript variables have only two
scopes.
– Global Variables: A global variable has global scope which
means it can be defined anywhere in your JavaScript code.
– Local Variables: A local variable will be visible only within a
function where it is defined. Function parameters are
always local to that function.
– Within the body of a function, a local variable takes
precedence over a global variable with the same name. If
you declare a local variable or function parameter with
the same name as a global variable, you effectively hide
the global variable.
Example
<script type="text/javascript">
<!--
var myVar = "global"; // Declare a global variable
function checkscope( ) {
var myVar = "local"; // Declare a local variable
document.write(myVar);
}
//-->
</script>
It will produce the following result:
JavaScript Variable Names
• While naming your variables in JavaScript, keep the following rules
in mind:
• You should not use any of the JavaScript reserved keywords as a
variable name.
• For example:
– break or boolean variable names are not valid.
• JavaScript variable names should not start with a numeral (0-9).
• They must begin with a letter or an underscore character.
• For example, 123test is an invalid variable name but _123test is a
valid one.
• JavaScript variable names are case-sensitive.
• For example, Name and name are two different variables.
JavaScript Reserved Words
• A list of all the reserved words in JavaScript are given in the following table.
• They cannot be used as JavaScript variables, functions, methods, loop labels, or
any object names.
Java script

More Related Content

What's hot

jQuery - Chapter 5 - Ajax
jQuery - Chapter 5 -  AjaxjQuery - Chapter 5 -  Ajax
jQuery - Chapter 5 - AjaxWebStackAcademy
 
19servlets
19servlets19servlets
19servletsAdil Jafri
 
Java script
Java scriptJava script
Java scriptITz_1
 
Java script -23jan2015
Java script -23jan2015Java script -23jan2015
Java script -23jan2015Sasidhar Kothuru
 
Introduction to Jquery
Introduction to Jquery Introduction to Jquery
Introduction to Jquery Tajendar Arora
 
Introduction to JavaScript Programming
Introduction to JavaScript ProgrammingIntroduction to JavaScript Programming
Introduction to JavaScript ProgrammingRaveendra R
 
Complete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptComplete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptEPAM Systems
 
cake phptutorial
cake phptutorialcake phptutorial
cake phptutorialice27
 
Ajax
AjaxAjax
Ajaxjainaman
 
Java Script ppt
Java Script pptJava Script ppt
Java Script pptPriya Goyal
 
Introduction To JavaScript
Introduction To JavaScriptIntroduction To JavaScript
Introduction To JavaScriptReema
 
Javascript Basics by Bonny
Javascript Basics by BonnyJavascript Basics by Bonny
Javascript Basics by BonnyBonny Chacko
 
Java script
Java scriptJava script
Java scriptShyam Khant
 
JavaScript - Chapter 12 - Document Object Model
  JavaScript - Chapter 12 - Document Object Model  JavaScript - Chapter 12 - Document Object Model
JavaScript - Chapter 12 - Document Object ModelWebStackAcademy
 
Ch. 8 script free pages
Ch. 8 script free pagesCh. 8 script free pages
Ch. 8 script free pagesManolis Vavalis
 

What's hot (20)

Jsp intro
Jsp introJsp intro
Jsp intro
 
jQuery - Chapter 5 - Ajax
jQuery - Chapter 5 -  AjaxjQuery - Chapter 5 -  Ajax
jQuery - Chapter 5 - Ajax
 
19servlets
19servlets19servlets
19servlets
 
Java script
Java scriptJava script
Java script
 
Java script basic
Java script basicJava script basic
Java script basic
 
Java script -23jan2015
Java script -23jan2015Java script -23jan2015
Java script -23jan2015
 
Introduction to Jquery
Introduction to Jquery Introduction to Jquery
Introduction to Jquery
 
Java script basics
Java script basicsJava script basics
Java script basics
 
Introduction to JavaScript Programming
Introduction to JavaScript ProgrammingIntroduction to JavaScript Programming
Introduction to JavaScript Programming
 
Java Script
Java ScriptJava Script
Java Script
 
Java script
Java scriptJava script
Java script
 
Complete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScriptComplete Notes on Angular 2 and TypeScript
Complete Notes on Angular 2 and TypeScript
 
cake phptutorial
cake phptutorialcake phptutorial
cake phptutorial
 
Ajax
AjaxAjax
Ajax
 
Java Script ppt
Java Script pptJava Script ppt
Java Script ppt
 
Introduction To JavaScript
Introduction To JavaScriptIntroduction To JavaScript
Introduction To JavaScript
 
Javascript Basics by Bonny
Javascript Basics by BonnyJavascript Basics by Bonny
Javascript Basics by Bonny
 
Java script
Java scriptJava script
Java script
 
JavaScript - Chapter 12 - Document Object Model
  JavaScript - Chapter 12 - Document Object Model  JavaScript - Chapter 12 - Document Object Model
JavaScript - Chapter 12 - Document Object Model
 
Ch. 8 script free pages
Ch. 8 script free pagesCh. 8 script free pages
Ch. 8 script free pages
 

Similar to Java script

Placement and variable 03 (js)
Placement and variable 03 (js)Placement and variable 03 (js)
Placement and variable 03 (js)AbhishekMondal42
 
Java script
Java scriptJava script
Java scriptJay Patel
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java scriptnanjil1984
 
JavaScript_III.pptx
JavaScript_III.pptxJavaScript_III.pptx
JavaScript_III.pptxrashmiisrani1
 
JavaScript with Syntax & Implementation
JavaScript with Syntax & ImplementationJavaScript with Syntax & Implementation
JavaScript with Syntax & ImplementationSoumen Santra
 
Final Java-script.pptx
Final Java-script.pptxFinal Java-script.pptx
Final Java-script.pptxAlkanthiSomesh
 
Java Script basics and DOM
Java Script basics and DOMJava Script basics and DOM
Java Script basics and DOMSukrit Gupta
 
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSON
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSONAn introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSON
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSONSyed Moosa Kaleem
 
javascriptPresentation.pdf
javascriptPresentation.pdfjavascriptPresentation.pdf
javascriptPresentation.pdfwildcat9335
 
IT2255 Web Essentials - Unit III Client-Side Processing and Scripting
IT2255 Web Essentials - Unit III Client-Side Processing and ScriptingIT2255 Web Essentials - Unit III Client-Side Processing and Scripting
IT2255 Web Essentials - Unit III Client-Side Processing and Scriptingpkaviya
 
Lecture 5 javascript
Lecture 5 javascriptLecture 5 javascript
Lecture 5 javascriptMujtaba Haider
 
BITM3730 10-4.pptx
BITM3730 10-4.pptxBITM3730 10-4.pptx
BITM3730 10-4.pptxMattMarino13
 
BITM3730 10-3.pptx
BITM3730 10-3.pptxBITM3730 10-3.pptx
BITM3730 10-3.pptxMattMarino13
 

Similar to Java script (20)

Placement and variable 03 (js)
Placement and variable 03 (js)Placement and variable 03 (js)
Placement and variable 03 (js)
 
Java script
Java scriptJava script
Java script
 
Java script
Java scriptJava script
Java script
 
Introduction to java script
Introduction to java scriptIntroduction to java script
Introduction to java script
 
JavaScript_III.pptx
JavaScript_III.pptxJavaScript_III.pptx
JavaScript_III.pptx
 
JavaScript with Syntax & Implementation
JavaScript with Syntax & ImplementationJavaScript with Syntax & Implementation
JavaScript with Syntax & Implementation
 
Java script
Java scriptJava script
Java script
 
Final Java-script.pptx
Final Java-script.pptxFinal Java-script.pptx
Final Java-script.pptx
 
Unit 2.4
Unit 2.4Unit 2.4
Unit 2.4
 
Java Script basics and DOM
Java Script basics and DOMJava Script basics and DOM
Java Script basics and DOM
 
WEB TECHNOLOGIES JavaScript
WEB TECHNOLOGIES JavaScriptWEB TECHNOLOGIES JavaScript
WEB TECHNOLOGIES JavaScript
 
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSON
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSONAn introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSON
An introduction to DOM , JAVASCRIPT , JQUERY, AJAX and JSON
 
javascriptPresentation.pdf
javascriptPresentation.pdfjavascriptPresentation.pdf
javascriptPresentation.pdf
 
IT2255 Web Essentials - Unit III Client-Side Processing and Scripting
IT2255 Web Essentials - Unit III Client-Side Processing and ScriptingIT2255 Web Essentials - Unit III Client-Side Processing and Scripting
IT2255 Web Essentials - Unit III Client-Side Processing and Scripting
 
Lecture 5 javascript
Lecture 5 javascriptLecture 5 javascript
Lecture 5 javascript
 
BITM3730 10-4.pptx
BITM3730 10-4.pptxBITM3730 10-4.pptx
BITM3730 10-4.pptx
 
Java script
Java scriptJava script
Java script
 
BITM3730 10-3.pptx
BITM3730 10-3.pptxBITM3730 10-3.pptx
BITM3730 10-3.pptx
 
Wt unit 2 ppts client sied technology
Wt unit 2 ppts client sied technologyWt unit 2 ppts client sied technology
Wt unit 2 ppts client sied technology
 
Wt unit 2 ppts client side technology
Wt unit 2 ppts client side technologyWt unit 2 ppts client side technology
Wt unit 2 ppts client side technology
 

More from Ravinder Kamboj

Data warehouse,data mining & Big Data
Data warehouse,data mining & Big DataData warehouse,data mining & Big Data
Data warehouse,data mining & Big DataRavinder Kamboj
 
Cost estimation for Query Optimization
Cost estimation for Query OptimizationCost estimation for Query Optimization
Cost estimation for Query OptimizationRavinder Kamboj
 
Query processing and optimization (updated)
Query processing and optimization (updated)Query processing and optimization (updated)
Query processing and optimization (updated)Ravinder Kamboj
 
Normalization of Data Base
Normalization of Data BaseNormalization of Data Base
Normalization of Data BaseRavinder Kamboj
 
Architecture of dbms(lecture 3)
Architecture of dbms(lecture 3)Architecture of dbms(lecture 3)
Architecture of dbms(lecture 3)Ravinder Kamboj
 
Lecture 1&amp;2(rdbms-ii)
Lecture 1&amp;2(rdbms-ii)Lecture 1&amp;2(rdbms-ii)
Lecture 1&amp;2(rdbms-ii)Ravinder Kamboj
 
Relational database management system (rdbms) i
Relational database management system (rdbms) iRelational database management system (rdbms) i
Relational database management system (rdbms) iRavinder Kamboj
 

More from Ravinder Kamboj (14)

Data warehouse,data mining & Big Data
Data warehouse,data mining & Big DataData warehouse,data mining & Big Data
Data warehouse,data mining & Big Data
 
DDBMS
DDBMSDDBMS
DDBMS
 
Cost estimation for Query Optimization
Cost estimation for Query OptimizationCost estimation for Query Optimization
Cost estimation for Query Optimization
 
Query processing and optimization (updated)
Query processing and optimization (updated)Query processing and optimization (updated)
Query processing and optimization (updated)
 
Query processing
Query processingQuery processing
Query processing
 
Normalization of Data Base
Normalization of Data BaseNormalization of Data Base
Normalization of Data Base
 
Architecture of dbms(lecture 3)
Architecture of dbms(lecture 3)Architecture of dbms(lecture 3)
Architecture of dbms(lecture 3)
 
Sql fundamentals
Sql fundamentalsSql fundamentals
Sql fundamentals
 
Lecture 1&amp;2(rdbms-ii)
Lecture 1&amp;2(rdbms-ii)Lecture 1&amp;2(rdbms-ii)
Lecture 1&amp;2(rdbms-ii)
 
File Management
File ManagementFile Management
File Management
 
HTML Forms
HTML FormsHTML Forms
HTML Forms
 
DHTML
DHTMLDHTML
DHTML
 
CSA lecture-1
CSA lecture-1CSA lecture-1
CSA lecture-1
 
Relational database management system (rdbms) i
Relational database management system (rdbms) iRelational database management system (rdbms) i
Relational database management system (rdbms) i
 

Recently uploaded

ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4MiaBumagat1
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Mark Reed
 
Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Celine George
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Celine George
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatYousafMalik24
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYKayeClaireEstoconing
 
Proudly South Africa powerpoint Thorisha.pptx
Proudly South Africa powerpoint Thorisha.pptxProudly South Africa powerpoint Thorisha.pptx
Proudly South Africa powerpoint Thorisha.pptxthorishapillay1
 
ACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfSpandanaRallapalli
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designMIPLM
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)lakshayb543
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxAshokKarra1
 
Q4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxQ4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxnelietumpap1
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parentsnavabharathschool99
 
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️9953056974 Low Rate Call Girls In Saket, Delhi NCR
 
Science 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxScience 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxMaryGraceBautista27
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPCeline George
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...JhezDiaz1
 
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxMULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxAnupkumar Sharma
 

Recently uploaded (20)

ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4ANG SEKTOR NG agrikultura.pptx QUARTER 4
ANG SEKTOR NG agrikultura.pptx QUARTER 4
 
Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)Influencing policy (training slides from Fast Track Impact)
Influencing policy (training slides from Fast Track Impact)
 
Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17Computed Fields and api Depends in the Odoo 17
Computed Fields and api Depends in the Odoo 17
 
Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17Difference Between Search & Browse Methods in Odoo 17
Difference Between Search & Browse Methods in Odoo 17
 
Earth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice greatEarth Day Presentation wow hello nice great
Earth Day Presentation wow hello nice great
 
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITYISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
ISYU TUNGKOL SA SEKSWLADIDA (ISSUE ABOUT SEXUALITY
 
Proudly South Africa powerpoint Thorisha.pptx
Proudly South Africa powerpoint Thorisha.pptxProudly South Africa powerpoint Thorisha.pptx
Proudly South Africa powerpoint Thorisha.pptx
 
ACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdfACC 2024 Chronicles. Cardiology. Exam.pdf
ACC 2024 Chronicles. Cardiology. Exam.pdf
 
Keynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-designKeynote by Prof. Wurzer at Nordex about IP-design
Keynote by Prof. Wurzer at Nordex about IP-design
 
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
Visit to a blind student's school🧑‍🦯🧑‍🦯(community medicine)
 
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptxFINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
FINALS_OF_LEFT_ON_C'N_EL_DORADO_2024.pptx
 
Karra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptxKarra SKD Conference Presentation Revised.pptx
Karra SKD Conference Presentation Revised.pptx
 
Q4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptxQ4 English4 Week3 PPT Melcnmg-based.pptx
Q4 English4 Week3 PPT Melcnmg-based.pptx
 
Choosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for ParentsChoosing the Right CBSE School A Comprehensive Guide for Parents
Choosing the Right CBSE School A Comprehensive Guide for Parents
 
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
call girls in Kamla Market (DELHI) 🔝 >༒9953330565🔝 genuine Escort Service 🔝✔️✔️
 
Science 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptxScience 7 Quarter 4 Module 2: Natural Resources.pptx
Science 7 Quarter 4 Module 2: Natural Resources.pptx
 
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
Model Call Girl in Tilak Nagar Delhi reach out to us at 🔝9953056974🔝
 
How to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERPHow to do quick user assign in kanban in Odoo 17 ERP
How to do quick user assign in kanban in Odoo 17 ERP
 
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
ENGLISH 7_Q4_LESSON 2_ Employing a Variety of Strategies for Effective Interp...
 
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptxMULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
MULTIDISCIPLINRY NATURE OF THE ENVIRONMENTAL STUDIES.pptx
 

Java script

  • 2. Where to place JavaScript • There is a flexibility given to include JavaScript code anywhere in an HTML document. • However the most preferred ways to include JavaScript in an HTML file are as follows: – Script in <head>...</head> section. – Script in <body>...</body> section. – Script in <body>...</body> and <head>...</head> sections. – Script in an external file and then include in <head>...</head> section.
  • 3. JavaScript in <head>...</head> Section • If you want to have a script run on some event, such as when a user clicks somewhere, then you will place that script in the head as follows: <html> <head> <script type="text/javascript"> <!-- function sayHello() { alert("Hello World") } //--> </script> </head> <body> Click here for the result <input type="button" onclick="sayHello()" value="Say Hello" /> </body> </html>
  • 4.
  • 5. JavaScript in <body>...</body> Section • If you need a script to run as the page loads so that the script generates content in the page, then the script goes in the <body> portion of the document. • In this case, you would not have any function defined using JavaScript. • Take a look at the following code.
  • 8. JavaScript in <body> and <head> Sections • You can put your JavaScript code in <head> and <body> section altogether as follows: <html> <head> <script type="text/javascript"> <!-- function sayHello() { alert("Hello World") } //--> </script> </head> <body> <script type="text/javascript"> <!-- document.write("Hello World") //--> </script> <input type="button" onclick="sayHello()" value="Say Hello" /> </body> </html>
  • 10. JavaScript in External File • As you begin to work more extensively with JavaScript, you will be likely to find that there are cases where you are reusing identical JavaScript code on multiple pages of a site. • You are not restricted to be maintaining identical code in multiple HTML files. • The script tag provides a mechanism to allow you to store JavaScript in an external file and then include it into your HTML files.
  • 11. Example <html> <head> <script type="text/javascript" src="filename.js" ></script> </head> <body> <input type="button" onclick="sayHello()" value="Say Hello" /> </body> </html> • To use JavaScript from an external file source, you need to write all your JavaScript source code in a simple text file with the extension ".js" • Then include that file as shown above.
  • 12. External Javascript • filename.js function sayHello() { alert("Hello World") }
  • 14. JavaScript Datatypes • One of the most fundamental characteristics of a programming language is the set of data types it supports. • These are the type of values that can be represented and manipulated in a programming language. • JavaScript allows you to work with three primitive data types: – Numbers, e.g., 123, 120.50 etc. – Strings of text, e.g. "This text string" etc. – Boolean, e.g. true or false. • JavaScript also defines two trivial data types, null and undefined, each of which defines only a single value. • In addition to these primitive data types, JavaScript supports a composite data type known as object.
  • 15. JavaScript Variables • Like many other programming languages, JavaScript has variables. • Variables can be thought of as named containers. • You can place data into these containers and then refer to the data simply by naming the container. • Before you use a variable in a JavaScript program, you must declare it. • Variables are declared with the var keyword as follows.
  • 16. Example <script type="text/javascript"> <!-- var money; var name; //--> </script> You can also declare multiple variables with the same var keyword as follows: <script type="text/javascript"> <!-- var money, name; //--> </script>
  • 17. Initialization • Storing a value in a variable is called variable initialization. • You can do variable initialization at the time of variable creation or at a later point in time when you need that variable. • For instance, you might create a variable named money and assign the value 2000.50 to it later. • For another variable, you can assign a value at the time of initialization as follows
  • 18. Example <script type="text/javascript"> <!-- var name = "Ali"; var money; money = 2000.50; //--> </script>
  • 19. JavaScript Variable Scope • The scope of a variable is the region of your program in which it is defined. JavaScript variables have only two scopes. – Global Variables: A global variable has global scope which means it can be defined anywhere in your JavaScript code. – Local Variables: A local variable will be visible only within a function where it is defined. Function parameters are always local to that function. – Within the body of a function, a local variable takes precedence over a global variable with the same name. If you declare a local variable or function parameter with the same name as a global variable, you effectively hide the global variable.
  • 20. Example <script type="text/javascript"> <!-- var myVar = "global"; // Declare a global variable function checkscope( ) { var myVar = "local"; // Declare a local variable document.write(myVar); } //--> </script> It will produce the following result:
  • 21. JavaScript Variable Names • While naming your variables in JavaScript, keep the following rules in mind: • You should not use any of the JavaScript reserved keywords as a variable name. • For example: – break or boolean variable names are not valid. • JavaScript variable names should not start with a numeral (0-9). • They must begin with a letter or an underscore character. • For example, 123test is an invalid variable name but _123test is a valid one. • JavaScript variable names are case-sensitive. • For example, Name and name are two different variables.
  • 22. JavaScript Reserved Words • A list of all the reserved words in JavaScript are given in the following table. • They cannot be used as JavaScript variables, functions, methods, loop labels, or any object names.