Essential Web Development: JavaScript, jQuery, and CSS Tips
Use of Alert Box
An alert box is a JavaScript popup dialog box used to display messages or warnings to the user.
Uses of Alert Box
- To display information messages
- To show warning messages
- To show error messages in form validation
- To notify users about system events
- Used for debugging purposes
JavaScript Program using RegExp Object
Definition: A Regular Expression (RegExp) is an object used to define a search pattern and perform matching operations on strings.
let text = "My email is [email protected]";
let pattern = /[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}/;
let result = text.match(pattern);
if(result) { alert("Email found: " + result); } else { alert("No email found"); }HTML and JavaScript Prompt Demo
<!DOCTYPE html>
<html>
<head><title>Prompt and Alert Example</title></head>
<body>
<h2>JavaScript Prompt and Alert Demo</h2>
<script>let name=prompt('Enter your name:');alert('Welcome '+name);</script>
</body>
</html>jQuery Selectors
jQuery Selectors are used to find and select HTML elements based on their element name, id, class, attributes, etc.
| Selector | Description |
|---|---|
| $("p") | Selects all paragraph elements |
| $("#id") | Selects element with specified id |
| $(".class") | Selects elements with specified class |
| $("*") | Selects all elements |
jQuery Callback
A callback function is a function that is executed after a jQuery effect or animation has completed.
jQuery Chaining
Chaining allows multiple jQuery methods to be executed on the same element in a single statement.
Definition of onload Event
The onload event is an HTML event that occurs when a web page or an element has completely loaded. It is commonly used to execute JavaScript code automatically after the page finishes loading.
Uses of onload Event
- Display welcome messages
- Initialize JavaScript functions
- Load data automatically
- Perform page setup operations
Definition of Array
An array is a collection of multiple values stored in a single variable. Each value in an array is identified by an index number starting from 0.
Syntax of Array
var array_name = [value1, value2, value3];
PHP Function Example
A function is a block of code that performs a specific task. It can accept parameters and return a value.
Form Validation Example
<!DOCTYPE html>
<html>
<head><title>Form Validation</title></head>
<body>
<form onsubmit="return validateForm()">
Name: <input type="text" id="name"><br><br>
Course: <select id="course"><option value="">--Select Course--</option><option value="BSc CSIT">BSc CSIT</option></select><br><br>
Gender: <input type="radio" name="gender" value="Male"> Male <input type="radio" name="gender" value="Female"> Female<br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>CSS Positioning
CSS Positioning is used to define how an HTML element is placed in a web page layout. It controls the position of elements using properties like relative, absolute, float, fixed, and static.
Internal vs External CSS
Internal CSS is defined inside the <style> tag within the <head> section of an HTML document.
External CSS is written in a separate .css file and linked to HTML using the <link> tag.
CSS Shadow Effects
CSS (Cascading Style Sheets) is a stylesheet language used to control the appearance of HTML elements including layout, colors, fonts, spacing, and shadow effects.
Benefits of CSS Shadows
- Create 3D visual appearance
- Improve UI/UX design
- Highlight important text or boxes
- Make web pages more attractive
- Provide depth to elements
English with a size of 4.31 KB