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
Web Development Articles
Page 543 of 801
How to determine if JavaScript object is an event?
In JavaScript, distinguishing between regular objects and event objects is important when handling user interactions and DOM events. An event object contains information about an event that occurred, such as mouse clicks or keyboard presses, while regular objects store data as properties and methods. JavaScript events are actions that happen in the browser, like clicking a button or loading a page. When these events occur, JavaScript creates event objects that contain details about what happened. Let's explore two reliable methods to check if an object is an event. Using the target Property Event objects have a target ...
Read MoreHow to handle bind an event using JavaScript?
In this tutorial, we will learn how to bind events using JavaScript. Events are actions or occurrences triggered by the browser or users. There are various types of events that represent different activities. For example, if a user clicks on a button, it triggers a "click" event. Similarly, when a webpage finishes loading, it triggers a "load" event. An Event Listener is a program that continuously listens for events to occur. Event Handlers are functions that execute when an event occurs. JavaScript binds events to their respective event handlers using the addEventListener method. Binding Events with addEventListener ...
Read MoreIs it possible to change values of the array when doing foreach() in javascript?
Yes, it is possible to change array values during forEach() iteration in JavaScript. Unlike some programming languages where modifying arrays during iteration is restricted, JavaScript's forEach() allows you to modify the original array by using the array parameter or accessing the array directly by index. The forEach Method The forEach() method executes a provided function once for each array element. It passes three parameters to the callback function: the current element value, the element's index, and the array itself. You can use the array parameter to modify elements during iteration. Syntax array.forEach(function(value, index, array) { ...
Read MoreGet div height with vanilla JavaScript
The HTML element is a container used to group and style other HTML elements. Getting the height of a div element is a common task in JavaScript, and there are several properties available to achieve this, each measuring different aspects of the element's dimensions. Using offsetHeight The offsetHeight property returns the total height of an element including content, padding, border, and scrollbar (if present). Syntax element.offsetHeight The offsetHeight includes: offsetHeight = content height + padding + border + scrollbar height ...
Read MoreHow to get image data url in JavaScript?
To obtain an image data URL in JavaScript, you can use several approaches depending on your source. The most common methods involve the Canvas API's toDataURL() method and the FileReader API for uploaded files. Using Canvas toDataURL() Method The toDataURL() method converts canvas content into a base64-encoded data URL. By default, it creates a PNG image, but you can specify JPEG format and quality. canvas.toDataURL(); // PNG format (default) canvas.toDataURL('image/jpeg'); // ...
Read MoreDifferent techniques for copying objects in JavaScript
In JavaScript, objects are collections of key-value pairs. The properties of the object are the keys and are denoted with strings. The value of the key is the value of the property of the given object. Types of Object Copying There are 2 types of copying objects: shallow copy and deep copy. Shallow Copy In shallow copy, an object is copied at the top level only. If the object contains nested objects, only the references are copied, not the actual nested objects. Example Following is an example of shallow copy using Object.assign(): ...
Read MoreDifference between .extend() / .assign() and .merge() in Lodash library.
The Lodash library is a JavaScript utility library that provides helpful functions for working with arrays, strings, objects, numbers, and more. This article compares three important object merging methods: Object.assign(), _.extend(), and _.merge(). The Object.assign() Method Object.assign() is a native JavaScript method that performs shallow copying of enumerable properties from source objects to a target object. It modifies the target object and returns it. Syntax Object.assign(target, source1, source2, ...) Example var employee = { emp_name: "Abdul Rawoof", company: "Tutorials Point", salary: 18000, ...
Read MoreWhat is the use of .stack property in JavaScript?
The .stack property in JavaScript provides detailed information about errors, including the error type, message, and call stack trace. It shows where the error occurred and the sequence of function calls that led to the error. The stack property is available on Error objects and contains a string representation of the stack trace. This is extremely useful for debugging as it shows the exact location and path of execution when an error occurs. Format of Error Stack The stack trace format typically displays: First line: Error type and message Subsequent lines: Function call stack with file ...
Read MoreHow to duplicate Javascript object properties in another object?
In JavaScript, objects are collections of key-value pairs where properties are identified by string keys. There are several ways to duplicate object properties from one object to another, each with different characteristics for handling nested objects and references. Using Spread Operator (...) The spread operator creates a shallow copy of an object by spreading its enumerable properties into a new object. It's represented by three dots (...) and is the most modern and readable approach. Example 1 This example demonstrates how the spread operator copies objects in JavaScript: var employee = { ...
Read MoreWindow.onload vs onDocumentReady in javascript
In JavaScript, window.onload and $(document).ready() are two different methods for executing code when a page loads, each with distinct timing and behavior. Window.onload The window.onload method executes after the entire web page has completely loaded, including all DOM elements, stylesheets, images, and other external resources. It only allows one function assignment — subsequent assignments will overwrite previous ones. Syntax window.onload = function() { // Code executes after everything loads }; window.onload = (event) => { // Arrow function syntax }; Example: Window.onload Behavior ...
Read More