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
Articles on Trending Technologies
Technical articles with clear explanations and examples
How to add a new list element under a \'ul\' using jQuery?
In this article, we will learn to add a new list element under a "ul" using jQuery. jQuery is a popular JavaScript library that simplifies HTML manipulation, event handling, and animations. One of its practical applications is dynamically adding elements to a webpage without requiring a full page reload. Why Use jQuery? DOM (Document Object Model) updating using basic JavaScript might become difficult and needs more than one line of code. jQuery has simplified it through easy selectors and functions. Employing jQuery helps us: Select elements efficiently Handle ...
Read MoreWhat is the difference between jQuery and JavaScript?
Both JavaScript and jQuery serve the same overarching objective of making webpages more interactive and dynamic. They give websites a sense of vibrancy. People may ask why there is a need for two distinct concepts if they serve the same function. Read through this article to find out how jQuery differs from JavaScript. What is JavaScript? JavaScript is a lightweight programming language that is used most often as a component of webpages. Its webpage implementations enable client-side script to interact with the user and create dynamic sites. It is a programming language that is interpreted and can handle ...
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 MoreJavaScript variables declare outside or inside loop?
In JavaScript, variables can be declared either inside or outside loops without performance differences. However, the choice affects variable scope and code readability. Variable Scope: var vs let With var, variables are function-scoped regardless of where declared. With let, variables are block-scoped, meaning they're only accessible within their block. Example: Variable Declared Outside Loop When declared outside, variables have broader scope and can be accessed throughout the function: function myFunction1() { var i; // Function scope - can be used throughout the function ...
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 MoreWhat's the difference between window.location and document.location?
In JavaScript, both window.location and document.location provide access to the current page's URL information, but they have subtle differences in browser compatibility and usage patterns. The window.location Property The window.location property is a reference to a Location object that represents the current URL of the document being displayed in that window. Since the window object is at the top of the scope chain, you can access location properties without the window prefix (e.g., location.href instead of window.location.href). Example: Getting Current URL JavaScript Get Current URL ...
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 remove the hash from window.location (URL) with JavaScript without page refresh?
The replaceState() method replaces the current history entry with the state objects, title, and URL passed as method parameters. This method is useful when you want to update the current history entry's state object or URL in response to a user action. To remove the hash from a URL without triggering a page refresh, we can use the HTML5 History API's replaceState() method. This approach modifies the browser's address bar while keeping the user on the same page. Syntax The syntax for the replaceState() method is as follows: window.history.replaceState(stateObj, title, url) Parameters ...
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 MoreConvert Image to Data URI with JavaScript
JavaScript provides several methods to convert images to Data URI (Base64) format. A Data URI is a string representation of an image that can be embedded directly in HTML or CSS. This tutorial covers two main approaches: using Canvas API for image URLs and FileReader API for local files. Method 1: Converting Image URL to Data URI Using Canvas This method uses the HTML5 Canvas API to convert an image from a URL to a Base64 Data URI string. Convert Image URL to Data URI ...
Read More