0% found this document useful (0 votes)
26 views

client side scripting

Uploaded by

adjutanttiger018
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
26 views

client side scripting

Uploaded by

adjutanttiger018
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

Client-Side Scripting:

1.JavaScript
1. Basics of JavaScript
• Syntax:
o JavaScript is a high-level, interpreted
programming language.
o Statements end with a semicolon (;).
o Comments can be added using // for
single-line comments or /* ... */ for multi-
line comments.
• Variables:
o Variables store data values.
o Declaration keywords:
▪ var: Used traditionally to declare
variables (function-scoped).
▪ let: Introduced in ES6 for block-
scoped variables.
▪ const: Introduced in ES6 for block-
scoped, immutable variables.
o Example:

• Operators:
o Arithmetic Operators: +, -, *, /, %, ++, --.
o Assignment Operators: =, +=, -=, *=, /=.
o Comparison Operators: ==, ===, !=, !==,
>, <, >=, <=.
o Logical Operators: && (AND), || (OR), !
(NOT).
o String Operators: + (concatenation).
2. Functions, Events, and Event Handling
• Functions:
o Functions are blocks of code designed to
perform a particular task.
o Functions are defined using the function
keyword and can take parameters and
return values.
o Example:

• Events:
o Events are actions or occurrences that
happen in the browser (e.g., clicks, key
presses, mouse movements).
o Events are handled using event listeners.
• Event Handling:
o You can handle events by attaching event
listeners to HTML elements.
o Example:
3. DOM (Document Object Model)
Manipulation
• The DOM represents the structure of a
webpage, where each element is an object
that can be manipulated using JavaScript.
• Common DOM manipulation methods:
o document.getElementById(): Selects an
element by its ID.
o document.querySelector(): Selects the
first element that matches a CSS selector.
o element.innerHTML: Gets or sets the
HTML content of an element.
o element.style: Modifies the inline style of
an element.
o element.setAttribute(): Sets the value of
an attribute on an element.
o Example:

2.Advanced JavaScript
1. ES6 Features
• let/const:
o let allows you to declare block-scoped
variables.
o const declares block-scoped, immutable
variables.
o Example:

• Arrow Functions:
o A shorter syntax for writing functions.
o Example:
• Promises:
o Used for asynchronous operations. A
promise represents a value that may be
available now, in the future, or never.
o Example:

2. AJAX (Asynchronous JavaScript and XML)


• AJAX:
o A technique for creating asynchronous
web applications, allowing web pages to
update without reloading.
o Commonly used with JSON (JavaScript
Object Notation) instead of XML.
o Example using XMLHttpRequest:

• Example using fetch API:

3. JavaScript Frameworks/Libraries
• jQuery:
o A fast, small, and feature-rich JavaScript
library that simplifies DOM manipulation,
event handling, and AJAX interactions.
o Example:

• React:
o A JavaScript library for building user
interfaces, particularly single-page
applications (SPAs).
o Uses components to build encapsulated
pieces of UI.
o Example:

You might also like