Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
Object Oriented Programming Articles
Page 34 of 589
How to make a condition for event 'click' inside/outside for multiple divs - JavaScript?
In JavaScript, you can detect clicks inside or outside multiple divs using event listeners and the contains() method. This is useful for dropdowns, modals, or interactive UI components. The Problem When working with multiple divs, you need to determine if a click event occurred inside any of the target divs or outside all of them. This requires checking the event target against all div elements. Solution Using Event Delegation Add a single event listener to the document and check if the clicked element is contained within any target div: ...
Read MoreWhat happens when length of object is set to 0 - JavaScript?
In JavaScript, setting an array's length property to 0 immediately removes all elements and clears the array. This is an efficient way to empty an array without creating a new one. Initial Array Example Let's start with an array containing some elements: var arrayObject = [ "John", "David", "Mike" ]; console.log("Original array:", arrayObject); console.log("Original length:", arrayObject.length); Original array: [ 'John', 'David', 'Mike' ] Original length: 3 Setting Length to 0 When you set length = 0, ...
Read MoreImplement Bubble sort with negative and positive numbers – JavaScript?
Bubble sort is a simple sorting algorithm that works by repeatedly comparing adjacent elements and swapping them if they're in the wrong order. It works equally well with arrays containing both negative and positive numbers. Let's say the following is our unsorted array with negative and positive numbers: var arr = [10, -22, 54, 3, 4, 45, 6]; How Bubble Sort Works Bubble sort compares each pair of adjacent elements and swaps them if the first element is greater than the second. This process continues until no more swaps are needed, meaning the array ...
Read MoreHide a video tag on a web page - JavaScript
In JavaScript, you can hide a video element on a web page by setting its display CSS property to "none" using the style.display property. Let's say we have the following sample video tag on a web page: You cannot play video here...... Syntax To hide a video element, use the following syntax: element.style.display = "none"; Method 1: Hide by Class Name This method selects the video element by its class name and hides it: ...
Read MoreHow to change the color of a button when the input field is filled – JavaScript?
In JavaScript, you can change a button's color dynamically when an input field is filled by using event listeners and checking the input's value. This creates an interactive user interface that responds to user input in real-time. Basic HTML Structure First, let's set up the HTML elements we'll be working with: Press Me Using onkeyup Event The onkeyup event triggers every time a key is released in the input field, allowing us to check the input's value and update the button color accordingly. ...
Read MoreTrigger an event IMMEDIATELY on mouse click, not after I let go of the mouse - JavaScript?
By default, the click event fires when you press and then release the mouse button. To trigger an event immediately when the mouse button is pressed down, use the mousedown event instead. The Difference Between click and mousedown The click event requires a complete click cycle (press down + release), while mousedown fires immediately when the button is pressed. Using mousedown Event Here's how to trigger an event immediately on mouse press: Mousedown Event Example ...
Read MoreHow to remove duplicate property values in array – JavaScript?
In JavaScript, you may need to remove duplicate values from array properties within an array of objects. This is common when working with data that contains repeated values that should be unique. Problem Example Consider an array of student objects where some students have duplicate marks in their studentMarks array: var details = [ { studentName: "John", studentMarks: [78, 98] }, { ...
Read MoreSet the value in local storage and fetch – JavaScript?
JavaScript's localStorage provides a simple way to store data persistently in the user's browser. Use localStorage.setItem() to store values and localStorage.getItem() to retrieve them. Syntax // Set a value localStorage.setItem("keyName", "value"); // Get a value let value = localStorage.getItem("keyName"); // Remove a value localStorage.removeItem("keyName"); // Clear all localStorage data localStorage.clear(); Setting Values in localStorage The setItem() method accepts two parameters: a key name and the value to store. Values are always stored as strings. ...
Read MoreHow to automate this object using JavaScript to set one key on each iteration as null?
When working with JavaScript objects, you might need to systematically set each property to null one at a time. This can be useful for testing, validation, or creating variations of an object. The most efficient approach is using Object.keys() with the spread operator. Understanding the Problem Given an object with multiple properties, we want to create new objects where exactly one property is set to null in each iteration, while keeping all other properties unchanged. Using Object.keys() with Spread Operator The Object.keys() method returns an array of property names, which we can iterate through. The spread ...
Read MoreHow to get id from tr tag and display it in a new td with JavaScript?
When working with HTML tables, you often need to extract the ID from table rows and display them within the table itself. This tutorial shows how to get the ID from tags and add them as new table cells using JavaScript. Sample Table Structure Consider the following table with ID attributes on each row: StudentName StudentCountryName ...
Read More