SlideShare a Scribd company logo
1 of 12
Begin Scripting!
Debjani Roy
Induction Training
The Document Object Model
Sample Form HTML
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Name</title>
<style>
<!--
p { font-family: Arial; font-size: 10pt; color: #000000 }
-->
</style>
</head>
<body>
<form method="POST" name="myForm">
<p>
Name:&nbsp;&nbsp;&nbsp;
<input type="text" name="name" value="" width=20>
</p>
<p>
<input type="submit" value="Submit" name="B1">
<input type="reset" value="Reset" name="B2">
</p>
</form>
</body>
</html>
Form
Sample Script
 Functions: Scripts are written using a function. A function is a block of code that aims to
perform a set of related actions.
 Syntax:
function function_name()
{
Script code goes here
}
 The keyword “function” should be in lower case
 Functions are written between the <script> </script> tags
<script language="javascript" type="text/javascript">
function function_name()
{
Script code goes here
}
function function name()
{
Script code goes here
}
</script>
Variables
 Variables are containers that hold values. You can declare variables
and store values in them
 Declare variable:
var fullname;
 Assign value to variable:
fullname=“Tom”;
 Declare and assign value to a variable:
var fullname=“Tom”;
 The length of a variable can be obtained by the length property:
len=fullname.length;
Associating a Function with an Event
 A function is called by associating the function with the event handler
of the object.
 Example:
<input type="submit" value="Submit" name="submit"
onclick="checkValues()">
 The function in the script tag:
<script language="javascript" type="text/javascript">
function checkValues()
{
// some code goes here
}
</script>
Script for function checkvalues()
<script language="javascript" type="text/javascript">
function checkValues()
{
var fullnametxt;
var fullnamelength;
fullnametxt=document.myForm.name.value;
if(fullnametxt=="")
{
var error="Please enter your name";
alert(error);
document.myForm.name.focus;
}
}
</script>
Associate function with an event
<input type="submit" value="Submit" name="submit"
onclick="checkValues()">
Execute the Script
Refine the Script
<script language="javascript" type="text/javascript">
function checkValues()
{
var fullnametxt;
var fullnamelength;
fullnametxt=document.myForm.name.value;
if(fullnametxt=="")
{
var error="Please enter your name";
alert(error);
document.myForm.name.focus;
}
else
{
alert("hello "+fullnametxt);
}
}
</script>
Execute the Script

More Related Content

What's hot

Html text and formatting
Html text and formattingHtml text and formatting
Html text and formatting
eShikshak
 

What's hot (20)

Java script
Java scriptJava script
Java script
 
Php workshop L01 CSS
Php workshop L01 CSSPhp workshop L01 CSS
Php workshop L01 CSS
 
Java Script
Java ScriptJava Script
Java Script
 
Java script
Java scriptJava script
Java script
 
6.copy text
6.copy text6.copy text
6.copy text
 
Images and Lists in HTML
Images and Lists in HTMLImages and Lists in HTML
Images and Lists in HTML
 
Introduction to HTML5
Introduction to HTML5Introduction to HTML5
Introduction to HTML5
 
HTML CSS and Web Development
HTML CSS and Web DevelopmentHTML CSS and Web Development
HTML CSS and Web Development
 
1.1 html lec 1
1.1 html lec 11.1 html lec 1
1.1 html lec 1
 
Web Development
Web DevelopmentWeb Development
Web Development
 
Html text and formatting
Html text and formattingHtml text and formatting
Html text and formatting
 
Html.docx
Html.docxHtml.docx
Html.docx
 
Js placement
Js placementJs placement
Js placement
 
Html JavaScript and CSS
Html JavaScript and CSSHtml JavaScript and CSS
Html JavaScript and CSS
 
Behat for writing tests in a stylized way
Behat for writing tests in a stylized wayBehat for writing tests in a stylized way
Behat for writing tests in a stylized way
 
Deliverance talk at plone meetup
Deliverance talk at plone meetupDeliverance talk at plone meetup
Deliverance talk at plone meetup
 
HTML practical file
HTML practical fileHTML practical file
HTML practical file
 
Web designing (1) - Html Basic Codding
Web designing (1) - Html Basic CoddingWeb designing (1) - Html Basic Codding
Web designing (1) - Html Basic Codding
 
HTML
HTMLHTML
HTML
 
HTML Lists & Llinks
HTML Lists & LlinksHTML Lists & Llinks
HTML Lists & Llinks
 

Viewers also liked

отчет род собран 16.11.2011
отчет род собран 16.11.2011отчет род собран 16.11.2011
отчет род собран 16.11.2011
elvira38
 
Mortgage Backed Securities
Mortgage Backed SecuritiesMortgage Backed Securities
Mortgage Backed Securities
Clint Hammond
 
Planning sheets for final piece
Planning sheets for final piecePlanning sheets for final piece
Planning sheets for final piece
aq101824
 
Acids & Bases Day 2
Acids & Bases   Day 2Acids & Bases   Day 2
Acids & Bases Day 2
jmori1
 
Подготовка ребенка к школе
Подготовка ребенка к школеПодготовка ребенка к школе
Подготовка ребенка к школе
elvira38
 
(Bukan) Kapsel IP; Alumni IP Unpad di NGO
(Bukan) Kapsel IP; Alumni IP Unpad di NGO(Bukan) Kapsel IP; Alumni IP Unpad di NGO
(Bukan) Kapsel IP; Alumni IP Unpad di NGO
Zainal Muttaqin
 
Educ 2190 mathematics stage 5 – year 10 – statistics
Educ 2190   mathematics stage 5 – year 10 – statisticsEduc 2190   mathematics stage 5 – year 10 – statistics
Educ 2190 mathematics stage 5 – year 10 – statistics
Matthew Lovegrove
 
Elements, Compounds & Mixtures-- Spring 2012
Elements, Compounds & Mixtures-- Spring 2012Elements, Compounds & Mixtures-- Spring 2012
Elements, Compounds & Mixtures-- Spring 2012
jmori1
 

Viewers also liked (20)

Tibet
TibetTibet
Tibet
 
Zero gravity surgery
Zero gravity surgeryZero gravity surgery
Zero gravity surgery
 
Helenius: Koulun mahdollisuudet kohdata nuorten seksuaalista häirintää
Helenius: Koulun mahdollisuudet kohdata nuorten seksuaalista häirintääHelenius: Koulun mahdollisuudet kohdata nuorten seksuaalista häirintää
Helenius: Koulun mahdollisuudet kohdata nuorten seksuaalista häirintää
 
Hietanen-Peltola: Valtakunnalliset ohjeet ja toimintamallit - apua arjen työhön
Hietanen-Peltola: Valtakunnalliset ohjeet ja toimintamallit - apua arjen työhönHietanen-Peltola: Valtakunnalliset ohjeet ja toimintamallit - apua arjen työhön
Hietanen-Peltola: Valtakunnalliset ohjeet ja toimintamallit - apua arjen työhön
 
отчет род собран 16.11.2011
отчет род собран 16.11.2011отчет род собран 16.11.2011
отчет род собран 16.11.2011
 
12 reasons why social media is non negotiable
12 reasons why social media is non negotiable12 reasons why social media is non negotiable
12 reasons why social media is non negotiable
 
Mortgage Backed Securities
Mortgage Backed SecuritiesMortgage Backed Securities
Mortgage Backed Securities
 
2011 2012 annual report
2011 2012 annual report2011 2012 annual report
2011 2012 annual report
 
Planning sheets for final piece
Planning sheets for final piecePlanning sheets for final piece
Planning sheets for final piece
 
Shortcodes
ShortcodesShortcodes
Shortcodes
 
Acids & Bases Day 2
Acids & Bases   Day 2Acids & Bases   Day 2
Acids & Bases Day 2
 
Подготовка ребенка к школе
Подготовка ребенка к школеПодготовка ребенка к школе
Подготовка ребенка к школе
 
Manifestação da República do Paraná contra Lula
Manifestação da República do Paraná contra LulaManifestação da República do Paraná contra Lula
Manifestação da República do Paraná contra Lula
 
Future Agricultures Consortium overview (Jan 13)
Future Agricultures Consortium overview (Jan 13)Future Agricultures Consortium overview (Jan 13)
Future Agricultures Consortium overview (Jan 13)
 
(Bukan) Kapsel IP; Alumni IP Unpad di NGO
(Bukan) Kapsel IP; Alumni IP Unpad di NGO(Bukan) Kapsel IP; Alumni IP Unpad di NGO
(Bukan) Kapsel IP; Alumni IP Unpad di NGO
 
Compete Group Evaluations
Compete Group EvaluationsCompete Group Evaluations
Compete Group Evaluations
 
Roditelska noemvri 2014
Roditelska noemvri 2014Roditelska noemvri 2014
Roditelska noemvri 2014
 
Бальямен
БальяменБальямен
Бальямен
 
Educ 2190 mathematics stage 5 – year 10 – statistics
Educ 2190   mathematics stage 5 – year 10 – statisticsEduc 2190   mathematics stage 5 – year 10 – statistics
Educ 2190 mathematics stage 5 – year 10 – statistics
 
Elements, Compounds & Mixtures-- Spring 2012
Elements, Compounds & Mixtures-- Spring 2012Elements, Compounds & Mixtures-- Spring 2012
Elements, Compounds & Mixtures-- Spring 2012
 

Similar to Begin scripting

PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docxPracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
ChantellPantoja184
 

Similar to Begin scripting (20)

Print this
Print thisPrint this
Print this
 
Introduction to PHP
Introduction to PHPIntroduction to PHP
Introduction to PHP
 
1cst
1cst1cst
1cst
 
Web Development Course: PHP lecture 2
Web Development Course: PHP lecture 2Web Development Course: PHP lecture 2
Web Development Course: PHP lecture 2
 
Tutorial_4_PHP
Tutorial_4_PHPTutorial_4_PHP
Tutorial_4_PHP
 
Tutorial_4_PHP
Tutorial_4_PHPTutorial_4_PHP
Tutorial_4_PHP
 
Tutorial_4_PHP
Tutorial_4_PHPTutorial_4_PHP
Tutorial_4_PHP
 
Tutorial_4_PHP
Tutorial_4_PHPTutorial_4_PHP
Tutorial_4_PHP
 
JavaScriptL18 [Autosaved].pptx
JavaScriptL18 [Autosaved].pptxJavaScriptL18 [Autosaved].pptx
JavaScriptL18 [Autosaved].pptx
 
計算機概論20161212
計算機概論20161212計算機概論20161212
計算機概論20161212
 
JavaServer Pages
JavaServer Pages JavaServer Pages
JavaServer Pages
 
Up & Running with Polymer
Up & Running with PolymerUp & Running with Polymer
Up & Running with Polymer
 
Dhtml chapter2
Dhtml chapter2Dhtml chapter2
Dhtml chapter2
 
Day of code
Day of codeDay of code
Day of code
 
Introhtml 2
Introhtml 2Introhtml 2
Introhtml 2
 
#3 HTML & CSS [know-how]
#3 HTML & CSS [know-how]#3 HTML & CSS [know-how]
#3 HTML & CSS [know-how]
 
Html basics-auro skills
Html basics-auro skillsHtml basics-auro skills
Html basics-auro skills
 
PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docxPracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
PracticeDataSetCh4.savPracticeOutput.2.spvoutputViewer00.docx
 
HTML FOR BEGINNERS AND FOR PRACTICE .pdf
HTML FOR BEGINNERS AND FOR PRACTICE .pdfHTML FOR BEGINNERS AND FOR PRACTICE .pdf
HTML FOR BEGINNERS AND FOR PRACTICE .pdf
 
Django Girls Mbale [victor's sessions]
Django Girls Mbale [victor's sessions]Django Girls Mbale [victor's sessions]
Django Girls Mbale [victor's sessions]
 

More from Debjani Roy

Sp rc a4_handout_television_v3
Sp rc a4_handout_television_v3Sp rc a4_handout_television_v3
Sp rc a4_handout_television_v3
Debjani Roy
 
User manual hl_wp_user_add_spotlight
User manual hl_wp_user_add_spotlightUser manual hl_wp_user_add_spotlight
User manual hl_wp_user_add_spotlight
Debjani Roy
 
User manual hl_wp_ss
User manual hl_wp_ssUser manual hl_wp_ss
User manual hl_wp_ss
Debjani Roy
 
User manual hl_wp_screen options
User manual hl_wp_screen optionsUser manual hl_wp_screen options
User manual hl_wp_screen options
Debjani Roy
 
User manual hl_wp_home_pagetabs
User manual hl_wp_home_pagetabsUser manual hl_wp_home_pagetabs
User manual hl_wp_home_pagetabs
Debjani Roy
 
Induss company overview 10-02-2010
Induss company overview 10-02-2010Induss company overview 10-02-2010
Induss company overview 10-02-2010
Debjani Roy
 
E force dnw rewrite-draft-v7-080607
E force dnw rewrite-draft-v7-080607E force dnw rewrite-draft-v7-080607
E force dnw rewrite-draft-v7-080607
Debjani Roy
 

More from Debjani Roy (20)

Xpflow ecko training-nov 28 2006-dr
Xpflow ecko training-nov 28 2006-drXpflow ecko training-nov 28 2006-dr
Xpflow ecko training-nov 28 2006-dr
 
E force kohl_presentation_062008-sn-dr
E force kohl_presentation_062008-sn-drE force kohl_presentation_062008-sn-dr
E force kohl_presentation_062008-sn-dr
 
Bhuma learning web_portal_discussion_oct2015
Bhuma learning web_portal_discussion_oct2015Bhuma learning web_portal_discussion_oct2015
Bhuma learning web_portal_discussion_oct2015
 
Bhuma learning portal_ui
Bhuma learning portal_uiBhuma learning portal_ui
Bhuma learning portal_ui
 
Bhuma alibaba om_2015a
Bhuma alibaba om_2015aBhuma alibaba om_2015a
Bhuma alibaba om_2015a
 
Sp rc a4_handout_television_v3
Sp rc a4_handout_television_v3Sp rc a4_handout_television_v3
Sp rc a4_handout_television_v3
 
Sp rc a4_handout_mobile_v4
Sp rc a4_handout_mobile_v4Sp rc a4_handout_mobile_v4
Sp rc a4_handout_mobile_v4
 
Sp rc a4_handout_laptop_v3
Sp rc a4_handout_laptop_v3Sp rc a4_handout_laptop_v3
Sp rc a4_handout_laptop_v3
 
Sp rc a4_handout_desktop_v3
Sp rc a4_handout_desktop_v3Sp rc a4_handout_desktop_v3
Sp rc a4_handout_desktop_v3
 
Serve pro a4_handout_dr copy
Serve pro a4_handout_dr copyServe pro a4_handout_dr copy
Serve pro a4_handout_dr copy
 
Technology Made Easy
Technology Made EasyTechnology Made Easy
Technology Made Easy
 
User manual hl_wp_user_add_spotlight
User manual hl_wp_user_add_spotlightUser manual hl_wp_user_add_spotlight
User manual hl_wp_user_add_spotlight
 
User manual hl_wp_ss
User manual hl_wp_ssUser manual hl_wp_ss
User manual hl_wp_ss
 
User manual hl_wp_screen options
User manual hl_wp_screen optionsUser manual hl_wp_screen options
User manual hl_wp_screen options
 
User manual hl_wp_home_pagetabs
User manual hl_wp_home_pagetabsUser manual hl_wp_home_pagetabs
User manual hl_wp_home_pagetabs
 
User manual hl_wp_clone_feature
User manual hl_wp_clone_featureUser manual hl_wp_clone_feature
User manual hl_wp_clone_feature
 
Induss company overview 10-02-2010
Induss company overview 10-02-2010Induss company overview 10-02-2010
Induss company overview 10-02-2010
 
Cash management
Cash managementCash management
Cash management
 
E force dnw rewrite-draft-v7-080607
E force dnw rewrite-draft-v7-080607E force dnw rewrite-draft-v7-080607
E force dnw rewrite-draft-v7-080607
 
Series of Blue Shades
Series of Blue ShadesSeries of Blue Shades
Series of Blue Shades
 

Recently uploaded

Recently uploaded (20)

Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
Emergent Methods: Multi-lingual narrative tracking in the news - real-time ex...
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024AXA XL - Insurer Innovation Award Americas 2024
AXA XL - Insurer Innovation Award Americas 2024
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 
Automating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps ScriptAutomating Google Workspace (GWS) & more with Apps Script
Automating Google Workspace (GWS) & more with Apps Script
 
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
Apidays New York 2024 - The Good, the Bad and the Governed by David O'Neill, ...
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024Axa Assurance Maroc - Insurer Innovation Award 2024
Axa Assurance Maroc - Insurer Innovation Award 2024
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data DiscoveryTrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
TrustArc Webinar - Unlock the Power of AI-Driven Data Discovery
 
A Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source MilvusA Beginners Guide to Building a RAG App Using Open Source Milvus
A Beginners Guide to Building a RAG App Using Open Source Milvus
 
Corporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptxCorporate and higher education May webinar.pptx
Corporate and higher education May webinar.pptx
 

Begin scripting

  • 3. Sample Form HTML <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Name</title> <style> <!-- p { font-family: Arial; font-size: 10pt; color: #000000 } --> </style> </head> <body> <form method="POST" name="myForm"> <p> Name:&nbsp;&nbsp;&nbsp; <input type="text" name="name" value="" width=20> </p> <p> <input type="submit" value="Submit" name="B1"> <input type="reset" value="Reset" name="B2"> </p> </form> </body> </html>
  • 5. Sample Script  Functions: Scripts are written using a function. A function is a block of code that aims to perform a set of related actions.  Syntax: function function_name() { Script code goes here }  The keyword “function” should be in lower case  Functions are written between the <script> </script> tags <script language="javascript" type="text/javascript"> function function_name() { Script code goes here } function function name() { Script code goes here } </script>
  • 6. Variables  Variables are containers that hold values. You can declare variables and store values in them  Declare variable: var fullname;  Assign value to variable: fullname=“Tom”;  Declare and assign value to a variable: var fullname=“Tom”;  The length of a variable can be obtained by the length property: len=fullname.length;
  • 7. Associating a Function with an Event  A function is called by associating the function with the event handler of the object.  Example: <input type="submit" value="Submit" name="submit" onclick="checkValues()">  The function in the script tag: <script language="javascript" type="text/javascript"> function checkValues() { // some code goes here } </script>
  • 8. Script for function checkvalues() <script language="javascript" type="text/javascript"> function checkValues() { var fullnametxt; var fullnamelength; fullnametxt=document.myForm.name.value; if(fullnametxt=="") { var error="Please enter your name"; alert(error); document.myForm.name.focus; } } </script>
  • 9. Associate function with an event <input type="submit" value="Submit" name="submit" onclick="checkValues()">
  • 11. Refine the Script <script language="javascript" type="text/javascript"> function checkValues() { var fullnametxt; var fullnamelength; fullnametxt=document.myForm.name.value; if(fullnametxt=="") { var error="Please enter your name"; alert(error); document.myForm.name.focus; } else { alert("hello "+fullnametxt); } } </script>