The onblur event in JavaScript triggers when an HTML element loses focus. This commonly occurs when users click away from an input field, tab to another element, or programmatically change focus. Syntax // OR element.onblur = function() { /* code */ }; // OR element.addEventListener('blur', function() { /* code */ }); Example: Input Field Validation Enter your email and click outside the field: ... Read More
Internet Explorer versions 8 and below don't support the standard addEventListener() method, causing the "Object doesn't support this property or method" error. This article shows how to handle cross-browser event handling. The Problem Modern browsers use addEventListener() for event handling, but older Internet Explorer versions use attachEvent() instead. Using addEventListener() directly will fail in IE8 and below. Solution 1: Using IE=edge Meta Tag Force Internet Explorer to use its latest rendering engine by adding this meta tag to your HTML head: ... Read More
Drawing lines with continuously varying line width on HTML canvas creates smooth, dynamic visual effects. This technique uses quadratic curves and gradually increases the line width to create flowing, organic-looking lines. Understanding the Approach The technique involves generating a series of points along a curved path and drawing segments between them with incrementally increasing line widths. Each segment uses quadraticCurveTo() to create smooth curves rather than sharp angles. Complete Example Variable Line Width Canvas ... Read More
Visual Studio 2012 and later versions include built-in IntelliSense and validation support for HTML5. Visual Studio 2010 had basic IntelliSense support for HTML5, but VS 2012 added corresponding code snippets, making it faster and easier to write HTML5 markup. Enabling HTML5 Validation in Visual Studio Follow these steps to enable HTML5 validation: Launch Visual Studio 2012 (or later). Go to Tools > Options from the menu bar. In the Options dialog, navigate to Text Editor > HTML > Validation. In ... Read More
The operation of adding 2 sets is known as a union. You need to add every element from one set to another while checking for duplicates. JavaScript's built-in Set class doesn't include a union method, but we can implement it using several approaches. Method 1: Using Spread Operator (Recommended) The most concise way to combine two sets is using the spread operator: let setA = new Set([1, 2, 3, 4]); let setB = new Set([2, 3, 5, 6]); // Create union using spread operator let unionSet = new Set([...setA, ...setB]); console.log(unionSet); console.log("Size:", unionSet.size); ... Read More
In JavaScript, adding new elements to the HTML DOM involves creating elements and inserting them into the document structure. This process requires understanding three key methods: createElement(), createTextNode(), and appendChild(). Core Methods for DOM Manipulation The Document object provides essential methods for creating and adding elements to the DOM: document.createElement(tagName) - Creates a new HTML element document.createTextNode(text) - Creates a text node appendChild(element) - Adds an element as the last child insertBefore(newElement, referenceElement) - Inserts an element before a reference element Syntax // Create element const element = document.createElement(tagName); // Create ... Read More
An image slider is a user interface component in JavaScript that allows users to view a series of images in a slideshow format. It is also known as a carousel or slideshow. An image slider consists of navigation buttons (such as next and previous buttons) that allow users to navigate from one image to the other. With the help of basic HTML for structuring and CSS for designing or making the image slider presentable, along with simple JavaScript logic, you can create an image slider efficiently. This article will guide you through creating a basic image slider with navigation ... Read More
In JavaScript, multiplying two arrays means performing element-wise multiplication, where each element at the same index in both arrays is multiplied together. This creates a new array with the products. Element-wise Array Multiplication When multiplying arrays, we iterate through corresponding indices and multiply the values at those positions: Array Multiplication Multiply Two Arrays Multiply Arrays ... Read More
We have an array of number literals like this: const numbers = [10, 6200, 20, 20, 350, 900, 26, 78, 888, 10000, 78, 15000, 200, 1280, 2000, 450]; We need to write a function that takes an array of numbers and a percentage (0-100). The function should return the first n elements from the array that sum up to equal or just less than the specified percentage of the total array sum. Understanding the Problem Let's take a simpler example: const numbers = [12, 10, 6, 8, 4, 2, 8]; ... Read More
We are required to write a JavaScript function that takes in a string which contains English alphabet, for example − const str = 'This is a sample string, will be used to collect some data'; The function should return an object containing the count of vowels and consonants in the string i.e. the output should be − { vowels: 17, consonants: 29 } Understanding the Problem To count vowels and consonants, we need to: Iterate through each character in the string Check if the character ... Read More
Data Structure
Networking
RDBMS
Operating System
Java
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Economics & Finance