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

Javascript and CSS Notes - 2024

These are the notes of various subjects

Uploaded by

farzangulzar7
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)
146 views

Javascript and CSS Notes - 2024

These are the notes of various subjects

Uploaded by

farzangulzar7
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/ 6

JAVASCRIPT & CSS (SHORT NOTES) 2023-24

2ND SEMESTER

UNIT 1:
Topic 1: Introduction

 JavaScript is a high-level programming language used for creating dynamic and


interactive web pages.
 CSS (Cascading Style Sheets) is a language used to describe the presentation of a
document written in HTML.
 JavaScript and CSS work together to enhance the functionality and visual appearance of
web pages.

Topic 2: Script Tag

 The script tag is used to embed or reference JavaScript code within an HTML document.
 It can be placed in the head or body section of an HTML document.
 Example: <script src="script.js"></script>

Topic 3: Data Types

 JavaScript has several built-in data types, including:


 Number: represents numeric values.
 String: represents textual data.
 Boolean: represents true or false values.
 Object: represents a collection of key-value pairs.
 Array: represents an ordered list of values.

Topic 4: Variables

 Variables are used to store data values in JavaScript.


 They are declared using the var, let, or const keyword.
 Example: var age = 25;

Topic 5: Literals

 Literals are directly assigned values that do not change.


 Examples: 5 (number literal), "Hello" (string literal), true (boolean literal).

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP


JAVASCRIPT & CSS (SHORT NOTES) 2023-24
2ND SEMESTER
Topic 6: Expressions

 Expressions are combinations of values, variables, and operators that produce a result.
 Example: 2 + 3 is an expression that evaluates to 5.

Topic 7: Operators

 JavaScript has various operators, including arithmetic, assignment, comparison, logical,


and more.
 Examples: + (addition), - (subtraction), = (assignment), == (equality check).

Topic 8: Conditional Statements (if, if-else-if-else)

 Conditional statements are used to make decisions based on certain conditions.


 The if statement executes a block of code if a condition is true.
 The if-else-if-else statement allows multiple conditions to be checked.
 Example:

if (condition) {
// code to execute if condition is true
} else if (condition2) {
// code to execute if condition2 is true
} else {
// code to execute if all conditions are false
}

Topic 9: Switch Case

 The switch statement is used to perform different actions based on different conditions.
 It evaluates an expression and matches the value to a specific case.
 Example:

switch (expression) {
case value1:
// code to execute if expression matches value1
break;
case value2:
// code to execute if expression matches value2

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP


JAVASCRIPT & CSS (SHORT NOTES) 2023-24
2ND SEMESTER
break;
default:
// code to execute if expression doesn't match any value
}

Topic 10: Looping Statements (while, for, do-while)

 Looping statements are used to repeatedly execute a block of code.


 The while loop executes the code as long as a condition is true.
 The for loop repeats a block of code a specified number of times.
 The do-while loop executes the code at least once and then repeats as long as a
condition is true.
 Examples:

while (condition) {
// code to execute
}

for (initialization; condition; increment/decrement) {


// code to execute
}

do {
// code to execute
} while (condition);

Topic 11: Array

 An array is a special variable that can store multiple values.


 Array elements are accessed using their index, starting from 0.
 Example: var fruits = ["apple", "banana", "orange"];

Topic 12: Associative Arrays

 JavaScript doesn't have built-in associative arrays, but objects can be used as key-value
pairs.

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP


JAVASCRIPT & CSS (SHORT NOTES) 2023-24
2ND SEMESTER
 Example: var person = { name: "John", age: 25 };

Topic 13: Functions

 Functions are reusable blocks of code that perform a specific task.


 They can take parameters as inputs and return a value.
 Example:

function addNumbers(num1, num2) {


return num1 + num2;
}

Topic 14: Event Handling

 Event handling allows JavaScript code to respond to user actions or events on a web
page.
 Events can be triggered by user interactions like clicks, key presses, etc.
 Example: <button onclick="myFunction()">Click me</button>

Topic 15: JavaScript Objects (Browser, Document, Window, etc.)

 JavaScript provides built-in objects that represent different components of a web page.
 Examples: window object represents the browser window, document object represents
the HTML document.

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP


JAVASCRIPT & CSS (SHORT NOTES) 2023-24
2ND SEMESTER

UNIT 2: CSS
1. DHTML (Dynamic HTML):
 DHTML combines HTML, CSS, and JavaScript to create interactive and dynamic
web pages.
 It allows for the manipulation of the structure and style of web content
dynamically.
2. Introduction to CSS:
 CSS (Cascading Style Sheets) is a stylesheet language used for describing the
look and formatting of a document written in HTML.
 It provides a way to separate the content of a web page from its presentation.
3. Style Sheets:
 Style sheets define the styles and formatting rules for HTML elements.
 There are three ways to include styles in an HTML document: a) Embedded Styles:
Styles defined within the <style> tags in the <head> section of the HTML
document. b) Inline Styles: Styles defined directly within the HTML tags using the
style attribute. c) External Style Sheets: Styles defined in a separate CSS file and
linked to the HTML document using the <link> tag.
4. Using Classes:
 CSS classes allow you to define styles that can be applied to multiple HTML
elements.
 Classes are defined using the .class-name selector in CSS, and applied to HTML
elements using the class attribute.
5. Style Sheet Properties:
a) Fonts Properties:
 font-family: Specifies the font family for text.
 font-size: Specifies the size of the font.
 font-weight: Specifies the weight (boldness) of the font.
b) Background and Color Properties:
 background-color: Sets the background color of an element.
 color: Sets the text color.
c) Text Properties:
 text-align: Specifies the alignment of text.
 text-decoration: Adds decorative styling to text (e.g., underline, line-through).
 text-transform: Controls the capitalization of text.
d) Box Properties:

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP


JAVASCRIPT & CSS (SHORT NOTES) 2023-24
2ND SEMESTER
 width: Sets the width of an element.
 height: Sets the height of an element.
 margin: Sets the margin (space) around an element.
 padding: Sets the padding (space) within an element.
 border: Sets the border properties of an element.
e) Classification Properties:
 display: Specifies the display behavior of an element (e.g., block, inline).
 white-space: Specifies how white space is handled within an element.
6. CSS Units:
 CSS supports different units of measurement for specifying sizes and distances,
such as pixels (px), percentages (%), em, rem, etc.
7. URLs:
 URLs can be used in CSS to specify the location of external resources like images,
fonts, etc.
 URLs are specified using the url() function in CSS.
8. Div and Span Tags:
 <div> and <span> are HTML tags used as containers to group and style content.
 <div> is a block-level element, while <span> is an inline element.
9. Dynamic Positioning and Layering:
 CSS provides positioning properties (position, top, left, etc.) to control the
placement of elements on a web page.
 Layering can be achieved using the z-index property to control the stacking
order of elements.
10. DHTML Events:
 DHTML events are actions or occurrences that can trigger JavaScript functions.
 Examples of DHTML events include mouse clicks, mouse hover, form submissions,
etc.

RECFORGE COMPANY DOWNLOAD JKSTUDYMATERIAL APP

You might also like