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
Usage of text-align property in CSS
The text-align property in CSS controls the horizontal alignment of text content within its container. It accepts several values to position text left, right, center, or justify it across the available width. Syntax text-align: left | right | center | justify | start | end; Property Values Value Description left Aligns text to the left (default) right Aligns text to the right center Centers text horizontally justify Stretches text to fill the full width Example Here's how to use different ...
Read MoreImplementJavaScript Auto Complete / Suggestion feature
JavaScript's auto-complete feature helps users by suggesting matching options as they type. This improves user experience and reduces typing errors. We can implement this using HTML5's datalist element combined with JavaScript for dynamic filtering. Understanding the HTML Structure The foundation uses an input field linked to a datalist element. The datalist contains predefined options that appear as suggestions: Complete Implementation body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; ...
Read MoreConvert object of objects to array in JavaScript
Let's say we have the following object of objects that contains rating of some Indian players, we need to convert this into an array of objects with each object having two properties namely name and rating where name holds the player name and rating holds the rating object. Following is our sample object: const playerRating = { 'V Kohli': { batting: 99, fielding: 99 }, 'R Sharma': { batting: 98, fielding: 95 }, ...
Read MoreDisplay all the numbers from a range of start and end value in JavaScript?
In JavaScript, you can display all numbers within a specified range using various methods. The most common approach is using a for loop to iterate through the range. Using for Loop Here's how to display numbers from a start value to an end value using a for loop: var startValue = 10; var endValue = 20; var result = []; function printAllValues(start, end) { for (var i = start; i < end; i++) { result.push(i); } } printAllValues(startValue, ...
Read MoreConvert JS array into an object - JavaScript
Converting a JavaScript array into an object is a common task in web development. This article shows different approaches to transform an array of objects into a single object using various JavaScript methods. Suppose we have an array of objects like this: const arr = [ {id: 1, name: "Mohan"}, {id: 2, name: "Sohan"}, {id: 3, name: "Rohan"} ]; console.log("Input array:", arr); Input array: [ { id: 1, name: 'Mohan' }, { id: 2, name: 'Sohan' }, { id: 3, name: 'Rohan' ...
Read MoreHow to set the vertical alignment of the content in an element with JavaScript?
In this tutorial, we will learn how to set the vertical alignment of the content in an element using JavaScript. The verticalAlign property of the HTML DOM Style object controls how content is positioned vertically within inline, inline-block, and table-cell elements. This property is particularly useful for aligning text within table cells or positioning inline elements relative to their surrounding content. Note that vertical-align only applies to inline, inline-block, and table-cell elements; it cannot be used to align block-level elements. Syntax element.style.verticalAlign = "value"; Common values include: top, middle, bottom, baseline, text-top, and ...
Read MoreHow to get the body's content of an iframe in JavaScript?
To get the body's content of an iframe in JavaScript, you need to access the iframe element first, then navigate to its document and retrieve the body content. This requires the iframe to be from the same origin due to browser security policies. Basic Approach First, get the iframe element using document.getElementById(), then access its content through contentWindow.document or contentDocument: Get Iframe Content Get Iframe Content ...
Read MoreHow to send a file and parameters within the same XMLHttpRequest
To send a file and parameters within the same XMLHttpRequest, you can use the FormData object which allows you to construct form data including both regular parameters and file uploads. HTML Form Setup First, create an HTML form with a file input: Upload function uploadFile() { const fileInput = document.getElementById('fileInput'); const file = fileInput.files[0]; if (!file) { alert('Please select a file'); ...
Read MoreIndent the first line of a paragraph in CSS
Use the text-indent property to indent the first line of a paragraph. This property accepts values in pixels (px), centimeters (cm), percentages (%), or em units. Syntax text-indent: value; Parameters The text-indent property accepts the following values: Length values: px, em, cm, mm, in, pt, pc Percentage: Relative to the width of the containing block Keywords: inherit, initial, unset Example: Basic Text Indentation You can try to run the following code to indent the first line: ...
Read MoreStop making form to reload a page in JavaScript
When a form is submitted, browsers reload the page by default. To prevent this behavior and handle form submissions with JavaScript, we need to stop the default form submission event. The Problem HTML forms automatically reload the page when submitted. This interrupts JavaScript processing and user experience: Method 1: Using preventDefault() with Form Submit Event The most reliable approach is using event.preventDefault() in the form's submit event handler: ...
Read More