Found 8894 Articles for Front End Technology

How to align an item set to its default value in CSS?

Diksha Patro
Updated on 17-Feb-2023 10:51:21

562 Views

In CSS, aligning an item to its default value means ensuring that the item maintains the alignment specified by the parent container's "align-items" property. The default value for "align-items" is "stretch" but you can set it to other values like "center", "flex-start" and so on. Approaches We have three different approaches for align an item set to its default value in CSS include − Using the “align-items:stretch” Using the “align-self:auto” Using the ”vertical-align:baseline” Approach 1: Using the"align-items:stretch" The first approach for aligning an item set to its default value in CSS is the "alignitems:stretch" property in CSS ... Read More

How to change the text of a label using JavaScript?

Abhishek
Updated on 17-Feb-2023 11:55:49

5K+ Views

Before going to learn about the method of changing the text of a label element in HTML document, let us understand what is the label tag itself? The label tag helps in improving the usability of the web page for mouse users, as it can toggle the text inside it if the user clicks on it. Let us now discuss about the methods of changing the text of the label element using JavaScript. JavaScript allow us to use two inbuilt properties to change the text of any element in the HTML document, as listed below − Using the innerHTML ... Read More

How to change the text and image by just clicking a button in JavaScript?

Abhishek
Updated on 17-Feb-2023 11:54:44

19K+ Views

The text given to an particular element and the image given in an img element can be easily changed using the JavaScript. We can use the onclick event with the button element in the HTML document to make this happen when the button is clicked. To change the text on click to the button we assign a function to the onclick event as the value which performs the required changes. Let us understand the methods of changing the text and the image individually using JavaScript in details with the help of code examples. Changing text of an element JavaScript provide ... Read More

How to change the src attribute of an img element in JavaScript / jQuery?

Abhishek
Updated on 17-Feb-2023 11:53:22

14K+ Views

There are different methods to change the path of an image given to the src attribute of an img element in HTML document using the JavaScript as well as jQuery. Method of changing the src attribute of an img element using JavaScript − Use the src property in JavaScript. Methods of changing the src attribute of an img element using jQuery − Using attr() method Using prop() method Let us discuss each of the above listed methods of changing the src of an img element one by one in details − Using src property in JavaScript ... Read More

How to Add Image into Dropdown List for each items?

Diksha Patro
Updated on 17-Feb-2023 16:06:15

6K+ Views

Creating a dropdown list with images can be a great way to make your website or application more visually appealing and user-friendly. In this article, we will go through a step-by-step example of how to add an image to each item in a dropdown list using HTML and CSS. Approach We will go through a step-by-step process of creating an HTML file with the necessary elements, using CSS to style and position those elements, and using the :hover selector to change the appearance of the elements when the user interacts with them. By the end of this article, you ... Read More

How to change the shape of a textarea using JavaScript?

Abhishek
Updated on 17-Feb-2023 11:51:52

308 Views

Textarea is a type of box with dynamic width and height, that means when the text is entered inside it, the text will not overflow and will only be contained by this texarea as it can dynamically increase or decrease its height and width. The textarea is mainly used inside the forms to get the full address of user and some other content with a larger text content. Commonly, A textarea is in the form of square shape or the rectangular shape, which can be changes using JavaScript as well as CSS. In this article, we are going to learn ... Read More

How to change the ID of the element using JavaScript?

Abhishek
Updated on 17-Feb-2023 11:49:19

3K+ Views

Generally, the ID given to any element in an HTML document is unique and can be assign to an element only once. But it is possible to change that id later using the JavaScript following the same rule of uniqueness for new ID as well as only single element can contain the new ID. In this article, we are going to learn about the ways of changing the ID of an element using JavaScript. JavaScript provides us or allow us to use the id property to get the id of any element as well as to change or add a ... Read More

How to debug JavaScript Program?

Abhishek
Updated on 17-Feb-2023 11:47:30

189 Views

While programming in any programming language, it is very general to do the mistakes in the logic building or in following the syntax rules of a language, which results in formation of errors and failure of our code to perform every task as expected. In this article, we are going to learn, how we can find the exact location of those errors and how we can fix them to make our code work as expected. The process of finding the errors in the code and then fixing them is known as Debugging. There are different ways of debugging a JavaScript ... Read More

How to calculate minutes between two dates in JavaScript?

AmitDiwan
Updated on 16-Feb-2023 15:31:26

10K+ Views

In this article, you will understand how to calculate minutes between two dates in JavaScript. The Date object works with dates and times. Date objects are created with new Date(). JavaScript will use the browser's time zone and display a date as a full text string. Example 1 In this example, we use a function to find the time difference. function minutesDiff(dateTimeValue2, dateTimeValue1) { var differenceValue =(dateTimeValue2.getTime() - dateTimeValue1.getTime()) / 1000; differenceValue /= 60; return Math.abs(Math.round(differenceValue)); } dateTimeValue1 = new Date(2020, 12, 12); console.log("The first date time value is defined ... Read More

How to add an element to a JSON object using JavaScript?

AmitDiwan
Updated on 16-Feb-2023 15:29:18

26K+ Views

In this article, you will understand how to add an element to a JSON object using JavaScript. JSON object literals are keys and values are separated by a colon surrounded by curly braces {}. Example 1 In this example, we add an element to a json object using bracket notation, var jsonObject = { members: { host: "hostName", viewers: { userName1: "userData1", ... Read More

Advertisements