Javascript and CSS Notes - 2024
Javascript and CSS Notes - 2024
Javascript and CSS Notes - 2024
2ND SEMESTER
UNIT 1:
Topic 1: Introduction
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 4: Variables
Topic 5: Literals
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
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
}
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
while (condition) {
// code to execute
}
do {
// code to execute
} while (condition);
JavaScript doesn't have built-in associative arrays, but objects can be used as key-value
pairs.
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>
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.
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: