Javascript Bangla
-
Upload
habib-rahman -
Category
Documents
-
view
270 -
download
12
Transcript of Javascript Bangla
-
7/31/2019 Javascript Bangla
1/56
Syntax
Enable
Location
External
Operator
Variable
Function
Event
Statement
If Statement
Else If Statement
While Loop
For Loop
Comments Array
Alert
Confirm
Prompt
Print
Redirect
Popup
Date
indexOf
getElementById
inner
|||| ( Javascr i pt Tut or i al i n Bangl a)( Javas cr i pt Tut or i al i n Bangl a)( Javas cr i pt Tut or i al i n Bangl a)( Javas cr i pt Tut or i al i n Bangl a):
run/execute
, execute/run
-
7/31/2019 Javascript Bangla
2/56
Mouse Trailers ( site )
Alert
HTML Form
webcoachbd.com (Javascript)
( Javascr i pt Synt ax Tut or i al i n Bangl a)( Javascr i pt Synt ax Tut or i al i n Bangl a)( Javascr i pt Synt ax Tut or i al i n Bangl a)( Javascr i pt Synt ax Tut or i al i n Bangl a):
1. script 2.
3. Test the script
script
type "text/JavaScript" type "text/css"
01.02.03.04.07.08.09.
:
-
7/31/2019 Javascript Bangla
3/56
Hello world!
document.write:
script document.write text, HTML text string "Hello World!"
SYNTAXSYNTAXSYNTAXSYNTAX :::: "document.write(Hello World!)" statement
statement
statement ( document.write statements )
( JavaScr i pt Enabl e Tut or i al i n Bangl a)( JavaScr i pt Enabl e Tut or i al i n Bangl a)( JavaScr i pt Enabl e Tut or i al i n Bangl a)( JavaScr i pt Enabl e Tut or i al i n Bangl a):
,, (active)
---- ::::Internet Explorer 6/7 security setting check
Tools menu Click
menu Internet Options
Internet OptionsSecurity tab Click
Custom Level Click security settings
Scroll Scripting section
script Enable Select
OK Click
Yes Click
---- ::::Firefox 2 Options Content setting check
-
7/31/2019 Javascript Bangla
4/56
Tools menu Click
menu Options
OptionsContent tab Click
Enable JavaScript check box
OK Click
::::Opera Preferences Content setting check
Tools menu Click
menu Preferences
Preferences Advanced tab Click
item Content
Enable JavaScript check box
OK Click
( Wher e To pl ace Javascr i pt Code)( Wher e To pl ace Javascr i pt Code)( Wher e To pl ace Javascr i pt Code)( Wher e To pl ace Javascr i pt Code):
head
body
(external) file
head or body event (
, event ) head ( "Hello World!" ),
body
(External)
HEAD SCRIPTHEAD SCRIPTHEAD SCRIPTHEAD SCRIPT ::::Script body tag Script event
alert box
-
7/31/2019 Javascript Bangla
5/56
01.02.03.
04.09.10.11.12.13.14.
:
head "Hello World!" alert box event
:::: ( Ext er nal JavaScr i pt Fi l e Tut or i al i n( Ext er nal JavaScr i pt Fi l e Tut or i al i n( Ext er nal JavaScr i pt Fi l e Tut or i al i n( Ext er nal JavaScr i pt Fi l e Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a):
headbody
external file
:::: ( EXTERNAL)( EXTERNAL)( EXTERNAL)( EXTERNAL) ::::external file Import Import
file extension ".js" file
"myjs.js" file Hello World alert function
HTML file file directory myjs.js file :
1.functionpopup() {2.alert("Hello World")3.}01.02.03.04.05.06.
-
7/31/2019 Javascript Bangla
6/56
07.08.09.
:
Tips:
Script external file
Script external file head tag (functions)
body tag
external file tag HTML
comment code
( JavaScr i pt Oper at or Tut or i al i n( J avaSc r i pt Oper at or Tut or i al i n( J avaScr i pt Oper at or Tut or i al i n( J avaSc r i pt Oper at or Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a):
symbol()
( arithmetic) ,
::::
Operator
+ +
- -
* *
/
/% %
::::
01.02.03.
-
7/31/2019 Javascript Bangla
7/56
05.varten = 1006.varlinebreak = "
"07.08.document.write("two plus ten = ")09.varresult = two + ten10.document.write(result)11.document.write(linebreak) 12.13.14.document.write("ten * ten = ")15.result = ten * ten16.document.write(result)17.document.write(linebreak) 18.19.document.write("ten / two = ")20.result = ten / two21.document.write(result)22.//-->23.24.
:
two plus ten = 12ten * ten = 100ten / two = 5
COMPARI SONCOMPARI SONCOMPARI SONCOMPARI SON ::::variables values Comparison equal
double equal (==) Comparison conditional statement
, conditional statement
Operator
== Equal To x==y
!= Not Equal To x!=y
y
=y
-
7/31/2019 Javascript Bangla
8/56
( JavaScr i pt Var i abl e Tut or i al i n( Jav aScr i pt Var i abl e Tut or i al i n( JavaScr i pt Var i abl e Tut or i al i n( Jav aScr i pt Var i abl e Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a):
(symbolic)
(data)Variable ( name)
move
:
"var" programming practice
"var"
01.
02.03.17.18.
:
Hello World!I am learning JavaScript!Script is Finishing up...
HTML
script
(=)
my_var = "Hello World!" my_var "Hello World!"
order script
:::: ( name) reserve
(name) practice
-
7/31/2019 Javascript Bangla
9/56
"shoe_size"
(-) : 7lucky, 99bottle 3charm
underscore : my_var, strong_man, happy_coder
( JavaScr i pt Funct i on Tut or i al i n Bangl a)( JavaSc r i pt Func t i on Tut or i al i n Bangl a)( JavaSc r i pt Func t i on Tut or i al i n Bangl a)( JavaSc r i pt Func t i on Tut or i al i n Bangl a):
(,
++,)
????
:
head
01.02.03.04.09.10.
11.12.13.14.
:
browser
pop up alert "popup"
"{,}" popup
-
7/31/2019 Javascript Bangla
10/56
popup alert
alert popup box
clickpopup box clickevent
( JavaScr i pt Event Tut or i al i n Bangl a)( JavaScr i pt Event Tut or i al i n Bangl a)( JavaScr i pt Event Tut or i al i n Bangl a)( JavaScr i pt Event Tut or i al i n Bangl a):
,
hover
keystroke
s :
HTML element
function
alert popup
"onclick" mouseover mouseout
view source
print?01.02.03.04.09.10.11.
-
7/31/2019 Javascript Bangla
11/56
12.13.14.15.16.
:
( JavaScr i pt St at ement Tut or i al( JavaScr i pt St at ement Tut or i al( JavaScr i pt St at ement Tut or i al( JavaScr i pt St at ement Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
Script
::::(,) semicolon(;)
semicolon(;)
::::
,
()
() ()
()
()
:
, ( conditional) if/then
statement
-
7/31/2019 Javascript Bangla
12/56
(condition) ( ) , ( )
(condition)(),()
Script website home page
website-
website ,,
(((()))) ?
, ,
? ,
"looping"looping Script
loop statement , loop statement
loop ()
looping
(((())))
object model statement object model
(((()))) Comment statement
? HTML comments
-
7/31/2019 Javascript Bangla
13/56
Single comment //(slash) (/*) (*/)
( JavaScr i pt I f St at ement Tut or i al i n( J av aScr i pt I f St at ement Tut or i al i n( Jav aScr i pt I f St at ement Tut or i al i n( J av aScr i pt I f St at ement Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a)
program program data- "If Statement" variable
Script "Today is my
Birthday!"
I F STATEMENT SYNTAX(I F STATEMENT SYNTAX(I F STATEMENT SYNTAX(I F STATEMENT SYNTAX( ) :) :) :) :If Statement
,
If Statement If Statement
variable
01.02.10.
:
Lucky 7!
variable
myNum Num If
Statement' myNum ("myNum == 7") ( Lucky 7! )
-
7/31/2019 Javascript Bangla
14/56
If Statement ("document.write...")
I F STATEMENT: ELSEI F STATEMENT: ELSEI F STATEMENT: ELSEI F STATEMENT: ELSE
If Statement (extension)
Else clause
Else clause Elseclause
myNum ()
01.02.12.
:You're not very lucky today...
( JavaScr i pt El se I f St at ement Tut or i al( JavaScr i pt El se I f St at ement Tut or i al( JavaScr i pt El se I f St at ement Tut or i al( JavaScr i pt El se I f St at ement Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
, - basic If Statement single If Statement
basic If Statement
Else Ifstatement basic If Statement extension conditional
statement
ELSE I FELSE I FELSE I FELSE I F :::: "student" script customized
custom extension Else Ifstatement
-
7/31/2019 Javascript Bangla
15/56
01.
02.
14.:
What stink bombs?
:::: Else Ifstatement If Statement Else
Ifstatement basic If Statement
Else Ifstatement , Else Ifstatement
Else Ifstatement
( JavaScr i pt Whi l e Loop Tut or i al i n( JavaSc r i pt Whi l e Loop Tut or i al i n( JavaSc r i pt Whi l e Loop Tut or i al i n( JavaSc r i pt Whi l e Loop Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a):
while loop advance
while loop while
loop
WHI LE LOOPWHI LE LOOPWHI LE LOOPWHI LE LOOP ::::
while loop
while loop
while loop "{ }"
-
7/31/2019 Javascript Bangla
16/56
while loop, condition statement
"{ }" "}" while loop condition
statement
condition statement while loop while
loop
WHI LE LOOPWHI LE LOOPWHI LE LOOPWHI LE LOOP ::::
basic while loop document.write
loop statement 01.02.
-
7/31/2019 Javascript Bangla
17/56
while loop
myCounterwhile loop
( JavaScr i pt For Loop Tut or i al i n Bangl a)( JavaScr i pt For Loop Tut or i al i n Bangl a)( JavaScr i pt For Loop Tut or i al i n Bangl a)( JavaScr i pt For Loop Tut or i al i n Bangl a):
( set of operations)
::::
counter variable counter variable
icounter variable
conditional statement (executing)
counter variable (check) increment loopcounter variable
loop(executed)
-
standarddesigner
::::counter value
counter loop (i = 0; i < 5; i++)item
01.02.
-
7/31/2019 Javascript Bangla
18/56
05.document.write(linebreak); 06.07.for(i = 0; i < 5; i++){
08.document.write("Counter i = "+ i);09.document.write(linebreak); 10.}11.12.document.write("For loop code is finished!");13.
:
For loop code is beginningCounter i = 0Counter i = 1Counter i = 2
Counter i = 3Counter i = 4For loop code is finished!
counter variable (name) i i
loop counter default (name) variable j,k,x,y z
counter ("i = 0;") conditional statement ("i < 5;")
counter (executed)
(executed) ("i++") counter i
(executed) looping
counter i (executed)
( JavaScr i pt Comment s Tut or i al i n Bangl a )( JavaScr i pt Comment s Tut or i al i n Bangl a )( JavaScr i pt Comment s Tut or i al i n Bangl a )( JavaScr i pt Comment s Tut or i al i n Bangl a ):
Script
(Comments)
(Comments) ,
(Comments)
(Comments)
(Comments) JavaScript
single ( comments )
multi-( comments )
-
7/31/2019 Javascript Bangla
19/56
SI NGLE LI NE COMMENTSSI NGLE LI NE COMMENTSSI NGLE LI NE COMMENTSSI NGLE LI NE COMMENTS ::::
single ( comments ) text (slashes) "//"(slashes) "//" text
1.2.8.
:I have comments in my JavaScript code!
MULTIMULTIMULTIMULTI ---- LI NE COMMENTSLI NE COMMENTSLI NE COMMENTSLI NE COMMENTS :::: single (comments )
single ( comments ) ( comments )
multi-( comments ) /* */
01.02.12.
:
I have multi-line comments!
( JavaScr i pt Ar r ay Tut or i al i n Bangl a)( JavaSc r i pt Ar r ay Tut or i al i n Bangl a)( JavaSc r i pt Ar r ay Tut or i al i n Bangl a)( JavaSc r i pt Ar r ay Tut or i al i n Bangl a):
-
7/31/2019 Javascript Bangla
20/56
array name
: myArray[2] = "Hello World"; array name : myArray[2]
built-in function
:::: JavaScript property
special function
, ,
01.02.11.
:
FootballBaseballCricket
position
::::
(sort) sort method
01.02.16.
-
7/31/2019 Javascript Bangla
21/56
:
BaseballCricketFootball
( Javascr i pt Al er t Funct i on Tut or i al( Jav ascr i pt Al er t Func t i on Tut or i al( Jav as cr i pt Al er t Funct i on Tut or i al( Jav ascr i pt Al er t Func t i on Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
Alert
pops up Alert
POPUPS / ALERTSPOPUPS / ALERTSPOPUPS / ALERTSPOPUPS / ALERTS ::::
JavaScript alert
(user) website
(user):
"the following page contains humor not suitable for those under the age of 14"
(user)
(user) :
::::
alert alert
onClickevent
1.2.5.
:
String alert alert box
-
7/31/2019 Javascript Bangla
22/56
( Javascr i pt Conf i r m Funct i on( Javasc r i pt Conf i r m Func t i on( Javasc r i pt Conf i r m Func t i on( Javasc r i pt Conf i r m Func t i onTut or i al i n Bangl a)Tut or i al i n Bangl a)Tut or i al i n Bangl a)Tut or i al i n Bangl a):
JavaScript confirm JavaScript alert
confirm box alert box :
confirm OK
cancel
confirm website
submission
website
JAVASCRI PT CONFI RMJAVASCRI PT CONFI RMJAVASCRI PT CONFI RMJAVASCRI PT CONFI RM ::::01.02.03.04.16.17.18.19.20.21.22.23.
:
("Leave webcoachbd.com?")
JavaScript popup window
OK , cancel
-
7/31/2019 Javascript Bangla
23/56
answer answer confirm
Answer ,Answer Answer
webcoachbd.com Answer
cancel
alert box
"Bye bye!" "Thanks for sticking around!"
window.location property
( Javascr i pt Pr ompt Tut or i al i n Bangl a)( Javascr i pt Pr ompt Tut or i al i n Bangl a)( Javascr i pt Pr ompt Tut or i al i n Bangl a)( Javascr i pt Pr ompt Tut or i al i n Bangl a):
(user)
(user)
prompt personal webpage : "Welcome to My Personal WebPage ferdous alam!" (
)
JAVASCRI PT PROMPT:JAVASCRI PT PROMPT:JAVASCRI PT PROMPT:JAVASCRI PT PROMPT:01.02.03.09.10.11.12.13.
:
-
7/31/2019 Javascript Bangla
24/56
( Javascr i pt Pr i nt Func t i on Tut or i al( Javas cr i pt Pr i nt Funct i on Tut or i al( Jav as cr i pt Pr i nt Funct i on Tut or i al( Javas cr i pt Pr i nt Funct i on Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
JavaScript print print JavaScript
print (user)
JAVASCRI PT PRI NT SCRJAVASCRI PT PRI NT SCRJAVASCRI PT PRI NT SCRJAVASCRI PT PRI NT SCRI PTI PTI PTI PT ---- WI NDOW. PRI NT( ) :WI NDOW. PRI NT( ) :WI NDOW. PRI NT( ) :WI NDOW. PRI NT( ) :
JavaScript print functionwindow.print()
onClickevent
view sourceprint?1.2.3.
:
:::: ( Javascr i pt Redi r ec t Tut or i al( J av asc r i pt Redi r ec t Tut or i al( J avasc r i pt Redi r ec t Tut or i al( J av asc r i pt Redi r ec t Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
JavaScriptredirect
location redirect :
JavaScript redirect
JAVASCRI PT WI NDOW. LOJAVASCRI PT WI NDOW. LOJAVASCRI PT WI NDOW. LOJAVASCRI PT WI NDOW. LOCATI ON:CATI ON:CATI ON:CATI ON:
-
7/31/2019 Javascript Bangla
25/56
JavaScript property window.location window.location
"=" URL
redirect www.google.com1.2.5.
JAVASCRI PT TI ME DELAJAVASCRI PT TI ME DELAJAVASCRI PT TI ME DELAJAVASCRI PT TI ME DELAYYYY
. "Update your bookmarks "
.
tizag.com tizag.com 01.02.03.04.09.10.11.12.Prepare to be redirected!13.
This page is a time delay redirect, please update your bookmarks to
our new14.location!
15.16.17.:Time Delay Redirect
Time Delay JavaScript setTimeoutfunction function delayer() () setTimeout
. 'delayer()' setTimeout()function
. 5000 - function delayer()
-
7/31/2019 Javascript Bangla
26/56
setTimeout() function 5000 -
WEB PAGE REDI RECTI ONWEB PAGE REDI RECTI ONWEB PAGE REDI RECTI ONWEB PAGE REDI RECTI ON::::URL location/ JavaScript
redirect HTML hyperlink URL
JavaScript redirect
( Javascr i pt Popup Wi ndow Tut or i al( Javascr i pt Popup Wi ndow Tut or i al( Javascr i pt Popup Wi ndow Tut or i al( Javascr i pt Popup Wi ndow Tut or i ali n Bangl a)i n Bangl a)i n Bangl a)i n Bangl a):
window (hyperlink) popup window
JavaScript window.open Function:
window.open() function browser window
function window.open() function
01.02.03.08.09.10.11.12.13.
14.
CLICK ME TOO!
15.16.:
CLICK ME TOO!
JavaScript Window.Open Arguments:
window.open() function popup window customize window.open
function
-
7/31/2019 Javascript Bangla
27/56
webpage URL
window text
string window properties
window
properties
dependent browser window Subwindow
fullscreen - fullscreen mode browser
height window height, pixels
width - window width, pixels-
left - screen Pixel offset
top - screen Pixel offset
resizable window resize window resize
status - status bar
Dependent, fullscreen, resizable, status ON/OFF properties
::::01.02.03.09.10.11.12.13.
-
7/31/2019 Javascript Bangla
28/56
14.15.
CLICK ME TOO!
16.:
CLICK ME TOO!
( Javascr i pt( Javascr i pt( Javascr i pt( Javascr i pt Dat e Tut or i al i n Bangl a)Dat e Tut or i al i n Bangl a)Dat e Tut or i al i n Bangl a)Dat e Tut or i al i n Bangl a)
:
Date object calculation timestamp computer clock Date object
Date object
time zone
(((( ) :) :) :) :Date object Date constructor (Date object
) computer clock Date object
1.It is now
2.
3.
6.
7.
:
I t i s now I t i s now I t i s now I t i s now
Date object
::::Date object
-
7/31/2019 Javascript Bangla
29/56
. getTime() since // @ : am
. getSeconds() (-)
. getMinutes() (-). getHours() (-)
. getDay() (-). =, ... , =
. getDate() (-)
. getMonth() (-)
. getFullYear() (-)
getDate, getMonth, getFullYear
01.It is now
02.
03.
10.
11.
:
I t i s now I t i s now I t i s now I t i s now
month variable (currentTime.getMonth() + 1)
month variable
(((()))) ::::Date HH:MM AM/PM (H
= , M =)
-
7/31/2019 Javascript Bangla
30/56
01.It is now
02.
03.
17.
18.
:
I t i s now I t i s now I t i s now I t i s now
hours or minutes variable 10 , ,
: am : am
( JavaScr i pt For m Val i dat i on Tut or i al i n( JavaScr i pt For m Val i dat i on Tut or i al i n( JavaScr i pt For m Val i dat i on Tut or i al i n( JavaScr i pt For m Val i dat i on Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a):
Order ,guestbook entry , ,
-
7/31/2019 Javascript Bangla
31/56
"
"
.text input
.text input
.text input
. text input alphanumeric character (numbers letters)
. text input character username password length
restriction
.
::::NONNONNONNON---- EMPTYEMPTYEMPTYEMPTY ::::
common
01.// If the length of the element's string is 0 then display helper message 02.functionnotEmpty(elem, helperMsg){03.if(elem.value.length == 0){04.alert(helperMsg);05.elem.focus(); // set the focus to this input06.returnfalse;07.}08.returntrue;09.}
notEmpty function input elem
HTML text input strings built in property
length property string length return elem.value input string
length elem.value.length
elem.value.length helperMsg
alert
-
7/31/2019 Javascript Bangla
32/56
:
01.02.functionnotEmpty(elem, helperMsg){03.if(elem.value.length == 0){04.alert(helperMsg);05.elem.focus();06.returnfalse;07.}08.returntrue;09.}10.11.12.Required Field:
13.16.
:
Required Field:
---- :::: ,, zip
input string regular expression /^[0-
9]+$/match string character
01.// If the element's string matches the regular expression it is all
numbers02.functionisNumeric(elem, helperMsg){03.varnumericExpression = /^[0-9]+$/;04.if(elem.value.match(numericExpression)){ 05.returntrue;
06.}else{07.alert(helperMsg);08.elem.focus();09.returnfalse;10.}11.}
string function match function string match:
elem.value.match(expression)
-
7/31/2019 Javascript Bangla
33/56
string , regular expression
numericExpression
regular expression match function numeric match function isNumeric function string
characters expression helperMsg
:
01.02.functionisNumeric(elem, helperMsg){03.varnumericExpression = /^[0-9]+$/;04.if(elem.value.match(numericExpression)){ 05.returntrue;06.}else{
07.alert(helperMsg);08.elem.focus();09.returnfalse;10.}11.}12.13.14.Numbers Only: 15.18.
:
Numbers Only:
---- :::: isAlphabet function isNumeric function regular expression
match function string , lowercase uppercase expression
01.// If the element's string matches the regular expression it is all
letters02.functionisAlphabet(elem, helperMsg){03.varalphaExp = /^[a-zA-Z]+$/;04.if(elem.value.match(alphaExp)){ 05.returntrue;06.}else{07.alert(helperMsg);08.elem.focus();09.returnfalse;10.}
-
7/31/2019 Javascript Bangla
34/56
11.}
:
01.02.functionisAlphabet(elem, helperMsg){03.varalphaExp = /^[a-zA-Z]+$/;04.if(elem.value.match(alphaExp)){ 05.returntrue;06.}else{07.alert(helperMsg);08.elem.focus();09.returnfalse;10.}11.}12.13.14.Letters Only: 15.18.
:
Letters Only:
---- :::: isAlphabet isNumeric function function
: isAlphanumeric
01.// If the element's string matches the regular expression it is numbers
and letters02.functionisAlphanumeric(elem, helperMsg){03.varalphaExp = /^[0-9a-zA-Z]+$/;04.if(elem.value.match(alphaExp)){ 05.returntrue;06.}else{07.alert(helperMsg);
08.elem.focus();09.returnfalse;10.}11.}
---- CHARACTERCHARACTERCHARACTERCHARACTER LENGTHLENGTHLENGTHLENGTH ::::Character field
zip lengthRestriction function
minimum maximum Character
-
7/31/2019 Javascript Bangla
35/56
01.function lengthRestriction(elem, min, max){02.var uInput = elem.value;03.if(uInput.length >= min && uInput.length = min && uInput.length
-
7/31/2019 Javascript Bangla
36/56
:
01.
02.functionmadeSelection(elem, helperMsg){03.if(elem.value == "Please Choose"){04.alert(helperMsg);05.elem.focus();06.returnfalse;07.}else{08.returntrue;09.}10.}11.12.13.Selection: 14.Please Choose
15.CA16.WI17.XX18.19.22.
:
Selection:
::::
,
@ sign dot (.) @ sign Character dot
(.) @ sign Character
Valid :
Invalid :
@deleted.net - @ sign characters
[email protected] - invalid character !
shoes@need_shining.com - domain name underscores
01.functionemailValidator(elem, helperMsg){02.varemailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;03.if(elem.value.match(emailExp)){
-
7/31/2019 Javascript Bangla
37/56
04.returntrue;05.}else{06.alert(helperMsg);
07.elem.focus();08.returnfalse;09.}10.}
:
01.02.functionemailValidator(elem, helperMsg){03.varemailExp = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;04.if(elem.value.match(emailExp)){ 05.returntrue;
06.}else{07.alert(helperMsg);08.elem.focus();09.returnfalse;10.}11.}12.13.14.Email: 15.
18.
:
Email:
::::
event onSubmitevent
return return
Validator
:
01.02.First Name: 03.Address: 04.Zip Code: 05.State: 06.Please Choose07.AL
-
7/31/2019 Javascript Bangla
38/56
08.CA09.TX10.WI
11.12.Username(6-8 characters): 13.Email: 14.15.01.functionformValidator(){02.// Make quick references to our fields03.varfirstname = document.getElementById('firstname');04.varaddr = document.getElementById('addr');
05.varzip = document.getElementById('zip');06.varstate = document.getElementById('state');
07.varusername = document.getElementById('username');08.varemail = document.getElementById('email');09.10.// Check each input in the order that it appears in the form!11.if(isAlphabet(firstname, "Please enter only letters for your name")){12.if(isAlphanumeric(addr, "Numbers and Letters Only for Address")){13.if(isNumeric(zip, "Please enter a valid zip code")){14.if(madeSelection(state, "Please Choose a State")){15.if(lengthRestriction(username, 6, 8)){16.if(emailValidator(email,"Please enter a valid email address")){17.returntrue;18.}19.}
20.}21.}22.}23.}24.
25.26.returnfalse;27.28.}
-:
Validatorfunction
:
001.002.003.functionformValidator(){004.// Make quick references to our fields005.varfirstname = document.getElementById('firstname');006.varaddr = document.getElementById('addr');
007.varzip = document.getElementById('zip');
-
7/31/2019 Javascript Bangla
39/56
008.varstate = document.getElementById('state');009.varusername = document.getElementById('username');010.varemail = document.getElementById('email');011.012.// Check each input in the order that it appears in the form!013.if(isAlphabet(firstname, "Please enter only letters for your name")){014.if(isAlphanumeric(addr, "Numbers and Letters Only for Address")){015.if(isNumeric(zip, "Please enter a valid zip code")){016.if(madeSelection(state, "Please Choose a State")){017.if(lengthRestriction(username, 6, 8)){018.if(emailValidator(email,"Please enter a valid email address")){019.returntrue;020.}021.}022.}023.}024.}025.}026.
027.028.returnfalse;029.030.}031.032.functionnotEmpty(elem, helperMsg){033.if(elem.value.length == 0){034.alert(helperMsg);035.elem.focus(); // set the focus to this input036.returnfalse;037.}038.returntrue;039.}040.041.functionisNumeric(elem, helperMsg){042.varnumericExpression = /^[0-9]+$/;043.if(elem.value.match(numericExpression)){ 044.returntrue;045.}else{046.alert(helperMsg);047.elem.focus();
048.returnfalse;049.}050.}051.052.functionisAlphabet(elem, helperMsg){053.varalphaExp = /^[a-zA-Z]+$/;054.if(elem.value.match(alphaExp)){ 055.returntrue;056.}else{057.alert(helperMsg);058.elem.focus();
-
7/31/2019 Javascript Bangla
40/56
059.returnfalse;060.}061.}
062.063.functionisAlphanumeric(elem, helperMsg){064.varalphaExp = /^[0-9a-zA-Z]+$/;065.if(elem.value.match(alphaExp)){ 066.returntrue;067.}else{068.alert(helperMsg);069.elem.focus();070.returnfalse;071.}072.}073.
074.functionlengthRestriction(elem, min, max){075.varuInput = elem.value;076.if(uInput.length >= min && uInput.length
-
7/31/2019 Javascript Bangla
41/56
109.Address:
110.Zip Code:
111.State: 112.Please Choose113.AL114.CA115.TX116.WI117.
118.Username(6-8 characters):
119.Email:
120.121.:First Name:
Address:
Zip Code:
State:
Username(6-8 characters):
Email:
Check Form
( JavaScr i pt St r i ng Func t i ons Tut or i al i n( J av aSc r i pt St r i ng Funct i ons Tut or i al i n( J avaSc r i pt St r i ng Funct i ons Tut or i al i n( J av aSc r i pt St r i ng Funct i ons Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a)
:
-property function(method ) object
PSEUDOPSEUDOPSEUDOPSEUDO ::::01.
02.varmyString = "Hello Thur!";
03.
-
7/31/2019 Javascript Bangla
42/56
04.//This is how you would access a property
05.varmyProperty = myString.property;
06.
07.//This is how you would access a function
08.varmyFunctionResult = myString.function(argument1, argument2);
09.
?( STRI NG PROPERTY)?( STRI NG PROPERTY)?( STRI NG PROPERTY)?( STRI NG PROPERTY)String property object : String object lengthproperty
String- characters
? ( STRI NG FUNCTI ON)? ( STRI NG FUNCTI ON)? ( STRI NG FUNCTI ON)? ( STRI NG FUNCTI ON)String String Function : String Function
String character
String String
STRING FUNCTIONSSTRING FUNCTIONSSTRING FUNCTIONSSTRING FUNCTIONS PROPERTI ES:PROPERTI ES:PROPERTI ES:PROPERTI ES: String ,,, advanced
dynamic
string -string
propertyfunction(method )object
Pseudo:
var myString = "Hello Thur!";
//This is how you would access a property
var myProperty = myString.property;
//This is how you would access a function
var myFunctionResult = myString.function(argument1, argument2);
-
7/31/2019 Javascript Bangla
43/56
String Property
?
String property object : Stringobject lengthproperty String-characters
String Function?
String String Function : String FunctionString character
String String
String FunctionsProperties: String , , , advanced dynamic
String Length:
Advanced scripter String webdevelopersubmission username character ,
stringlength
-
7/31/2019 Javascript Bangla
44/56
String Length Property:
length property character String-
:
var myString = "123456";
var length = myString.length;
document.write("The string is this long: " + length);
// Same thing, but using the property inside the write function
document.write("
The string is this long: " + myString.length);::::
String Length ::::
String character length property length property
-
7/31/2019 Javascript Bangla
45/56
:
var myString = "123456";
document.write("The string is this long: " + myString.length);
myString = myString + "7890";
document.write("
The string is now this long: " + myString.length);::::
( JavaScr i pt St r i ng Lengt h)( JavaScr i pt St r i ng Lengt h)( JavaScr i pt St r i ng Lengt h)( JavaScr i pt St r i ng Lengt h):
( JAVASCRI PT STRI NG L( JAVASCRI PT STRI NG L( JAVASCRI PT STRI NG L( JAVASCRI PT STRI NG LENGTH)ENGTH)ENGTH)ENGTH)Advanced scripter String
submission ,
length
( STRI NG LENGTH PROPE( STRI NG LENGTH PROPE( STRI NG LENGTH PROPE( STRI NG LENGTH PROPERTY)RTY)RTY)RTY)
length property character -
01.02.varmyString = "123456";03.04.varlength = myString.length;
05.06.document.write("The string is this long: "+ length);
07.08.// Same thing, but using the property inside the write function
-
7/31/2019 Javascript Bangla
46/56
09.document.write("
The string is this long: "+ myString.length);10.11.:
The string is this long: 6
The string is this long: 6The string is this long: 6
The string is this long: 6
LENGTHLENGTHLENGTHLENGTH :::: character length property length property
1.2.varmyString = "123456";3.document.write("The string is this long: "+ myString.length);4.5.myString = myString + "7890";6.document.write("
The string is now this long: "+ myString.length);7.8.:
The string is this long: 6
The string is now this long: 10The string is this long: 6
The string is now this long: 10
( JavaScr i pt Spl i t Func t i on)( J avaSc r i pt Spl i t Func t i on)( JavaScr i pt Spl i t Func t i on)( J avaSc r i pt Spl i t Func t i on):
: "Bobby Susan Tracy Jack Phil Yannis"
space character " " splitfunction
( SPLI T FUNCTI ON: DEL( SPLI T FUNCTI ON: DEL( SPLI T FUNCTI ON: DEL( SPLI T FUNCTI ON: DELI MI TER)I MI TER)I MI TER)I MI TER)space character " " delimiter splitfunction
delimiter array splitfunction
delimiter
::::
-
7/31/2019 Javascript Bangla
47/56
delimiter
splitfunction array mySplitResult
1.2.varmyString = "123456789";3.
4.varmySplitResult = myString.split("5");5.
6.document.write("The first element is "+ mySplitResult[0]);7.document.write("
The second element is "+ mySplitResult[1]);8.:
The first element is 1234The second element is 6789The first element is 1234
The second element is 6789
delimiter delimiterString
character
SPLI T FUNCTI ON SPLI T FUNCTI ON SPLI T FUNCTI ON SPLI T FUNCTI ON ::::split function split
delimiter
space character " "
01.02.varmyString = "zero one two three four";03.04.varmySplitResult = myString.split(" ");05.06.for(i = 0; i < mySplitResult.length; i++){07.document.write("
Element "+ i + " = "+ mySplitResult[i]);08.}09.:Element 0 = zero
Element 1 = one
Element 2 = two
Element 3 = three
Element 4 = four
Element 0 = zero
Element 1 = one
-
7/31/2019 Javascript Bangla
48/56
Element 2 = two
Element 3 = three
Element 4 = four
( JavaScr i pt St r i ng Sear ch)( JavaScr i pt St r i ng Sear ch)( JavaScr i pt St r i ng Sear ch)( JavaScr i pt St r i ng Sear ch):
search function
( JAVASCRI PT SEARC ( JAVASCRI PT SEARC ( JAVASCRI PT SEARC ( JAVASCRI PT SEARCH FUNCTI ON)H FUNCTI ON)H FUNCTI ON)H FUNCTI ON)regular expression regular expression match
match position match -
SEARCH FUNCTI ON REGUSEARCH FUNCTI ON REGUSEARCH FUNCTI ON REGUSEARCH FUNCTI ON REGULAR EXPRESSI ON:LAR EXPRESSI ON:LAR EXPRESSI ON:LAR EXPRESSI ON: , regular expression slash
01.02.varmyRegExp = /Alex/;03.varstring1 = "Today John went to the store and talked with Alex.";04.varmatchPos1 = string1.search(myRegExp);05.06.if(matchPos1 != -1)07.document.write("There was a match at position "+ matchPos1);08.else09.document.write("There was no match in the first string");10.11.12.
:
There was a match at position 45There was a match at position 45
, regular expression "Alex" search function string1 match match ()
( STRI NG SEARCH FU ( STRI NG SEARCH FU ( STRI NG SEARCH FU ( STRI NG SEARCH FUNCTI ON: ALTERNATI VENCTI ON: ALTERNATI VENCTI ON: ALTERNATI VENCTI ON: ALTERNATI VE SEARCHES)SEARCHES)SEARCHES)SEARCHES)
-
7/31/2019 Javascript Bangla
49/56
regular expression pipe character "|" Alternative search
/RegExp1|RegExp2/search pipe character
search
01.02.varmyRegExp = /Alex|John/;
03.varstring1 = "Today John went to the store and talked with Alex.";04.varmatchPos1 = string1.search(myRegExp);05.06.if(matchPos1 != -1)07.document.write("There was a match at position "+ matchPos1);08.else09.document.write("There was no match in the first string");10.
11.12.
:
There was a match at position 6There was a match at position 6
regular expression : Alex John search function
string1
( ADVANCED SEARCH FUN( ADVANCED SEARCH FUN( ADVANCED SEARCH FUN( ADVANCED SEARCH FUNCTI ON)CTI ON)CTI ON)CTI ON)search function
01.02.varmyRegExp1 = /Tom|Jan|Alex/;03.varstring1 = "John went to the store and talked with Alexandra today."; 04.varmatchPos1 = string1.search(myRegExp1);05.06.if(matchPos1 != -1)07.document.write("The first string found a match at "+ matchPos1);08.else09.document.write("No match was found in the first string");10.11.varmyRegExp2 = /Tom|Jan|Alex /;
12.varstring2 = "John went to the store and talked with Alexandra today."; 13.varmatchPos2 = string2.search(myRegExp2);14.if(matchPos2 != -1)15.document.write("
The second string found a match at " + matchPos2);16.else17.document.write("
No match was found in the second string");18.19.varmyRegExp3 = /Tom|Jan|Alexandra/;20.varstring3 = "John went to the store and talked with Alexandra today."; -
7/31/2019 Javascript Bangla
50/56
21.varmatchPos3 = string3.search(myRegExp3);22.if(matchPos3 != -1)23.document.write("
The third string found a match at "+ matchPos3);24.else25.document.write("
No match was found in the third string");26.27.varmyRegExp4 = /Tom|Jan|Alexandra/;28.varstring4 = "John went to the store and talked with Alex today.";29.varmatchPos4 = string4.search(myRegExp4);30.if(matchPos4 != -1)31.document.write("
The fourth string found a match at " + matchPos4);32.else33.document.write("
No match was found in the fourth string");34.:
The first string found a match at 39
No match was found in the second string
The third string found a match at 39
No match was found in the fourth stringThe first string found a match at 39
No match was found in the second string
The third string found a match at 39
No match was found in the fourth string
( JavaScr i pt St r i ng Repl ace)( JavaScr i pt St r i ng Repl ace)( JavaScr i pt St r i ng Repl ace)( JavaScr i pt St r i ng Repl ace):
:
:
.SearchFor:
.ReplaceText:
::::
-
7/31/2019 Javascript Bangla
51/56
01.02.varvisitorName = "Chuck";03.varmyOldString = "Hello username! I hope you enjoy your stay username."; 04.varmyNewString = myOldString.replace("username", visitorName);05.06.document.write("Old string = "+ myOldString);07.document.write("
New string = "+ myNewString);08.09.:
Old string = Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay username.Old
string = Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay username.
SearchFor
::::
01.02.varvisitorName = "Chuck";03.varmyOldString = "Hello username! I hope you enjoy your stay username.";
04.varmyNewString = myOldString.replace(/username/, visitorName);05.06.document.write("Old string = "+ myOldString);
07.document.write("
New string = "+ myNewString);08.09.:
Old string = Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay username.Old
string = Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay username.
-
7/31/2019 Javascript Bangla
52/56
::::
g
01.02.varvisitorName = "Chuck";03.varmyOldString = "Hello username! I hope you enjoy your stay username."; 04.varmyNewString = myOldString.replace(/username/g, visitorName);05.06.document.write("Old string = "+ myOldString);07.document.write("
New string = "+ myNewString);08.09.:
Old string = Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay Chuck.Old string
= Hello username! I hope you enjoy your stay username.
New string = Hello Chuck! I hope you enjoy your stay Chuck.
( JavaScr i pt( JavaScr i pt( JavaScr i pt( JavaScr i pt i ndexOf Funct i on)i ndexOf Funct i on)i ndexOf Funct i on)i ndexOf Funct i on):
indexOf
::::
.SearchString:
.Offset ():
:
www
1.2.varaURL = "http://www.tizag.com/";
-
7/31/2019 Javascript Bangla
53/56
3.varaPosition = aURL.indexOf("www");4.5.document.write("The position of www = "+ aPosition);6.
:
The position of www = 7The position of www = 7
:
www www www
01.
02.var aURL = "http://www.tizag.com/www.html";
03.var aPosition = aURL.indexOf("www");
04.var secondPos = aURL.indexOf("www", aPosition + 1);
05.
06.document.write("The position of www = " + aPosition);
07.document.write("
The position of the second www = " + secondPos);08.
09.
:
The position of www = 7
The position of the second www = 21The position of www = 7
The position of the second www = 21
( JavaScr i pt get El ement ByI d Tut or i al i n( JavaSc r i pt get El ement By I d Tut or i al i n( JavaScr i pt get El ement By I d Tut or i al i n( JavaSc r i pt get El ement By I d Tut or i al i nBangl a)Bangl a)Bangl a)Bangl a)
:
??
: .(document.getElementById)
-
7/31/2019 Javascript Bangla
54/56
01.
02.function notEmpty(){
03.var myTextField = document.getElementById('myText');
04.if(myTextField.value != "")
05.alert("You entered: " + myTextField.value)
06.else
07.alert("Would you please enter some text?")
08.}
09.
10.
11.
:
document.getElementById
myTextField
:
getElementByIdfunction
( JavaScr i pt i nner HTML)( JavaScr i pt i nner HTML)( JavaScr i pt i nner HTML)( JavaScr i pt i nner HTML)
:
!
-
7/31/2019 Javascript Bangla
55/56
(innerHTML) :
getElementByIdfunction
1.
2.functionchangeText(){
3.document.getElementById('boldStuff').innerHTML = 'Fred Flinstone';
4.}
5.
6.
Welcome to the site dude
7.
Welcome to the site dude
::::01.
02.functionchangeText2(){
03.varuserInput = document.getElementById('userInput').value;
04.document.getElementById('boldStuff2').innerHTML = userInput;
05.}
06.
07.
Welcome to the site dude
08.
09.
-
7/31/2019 Javascript Bangla
56/56
Welcome to the site dude
Enter Text
(innerHTML) :
01.
02.functionchangeText3(){
03.varoldHTML = document.getElementById('para').innerHTML;
04.varnewHTML = ""+ oldHTML +"";
05.document.getElementById('para').innerHTML = newHTML;
06.}
07.
08.
Welcome to the site dude
09.
Welcome to the site dude