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 293 of 801
How to change the ID of the element using JavaScript?
Generally, the ID given to any element in an HTML document is unique and can be assigned to an element only once. However, it is possible to change that ID later using JavaScript while following the same rule of uniqueness for the new ID. In this article, we will learn how to change the ID of an element using JavaScript. JavaScript provides the id property to get the ID of any element as well as to change or add a new ID to any HTML element in the document. Syntax The following syntax shows how to use ...
Read MoreHow to change the shape of a textarea using JavaScript?
A textarea is an HTML element that provides a multi-line text input field with dynamic width and height. By default, textareas appear as rectangular boxes, but you can change their shape using JavaScript to modify CSS properties. In this article, we'll explore different methods to transform textarea shapes using JavaScript, including creating parallelograms and ellipses through CSS property manipulation. Using transform Property for Parallelogram Shape The transform property with skew() function can transform a rectangular textarea into a parallelogram by skewing it along the X or Y axis. Syntax element.style.transform = "skew(angle)"; ...
Read MoreHow to change the src attribute of an img element in JavaScript / jQuery?
There are different methods to change the path of an image given to the src attribute of an img element in HTML document using JavaScript and 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 ...
Read MoreHow to change the text and image by just clicking a button in JavaScript?
In JavaScript, you can dynamically change text content and images by using the onclick event with button elements. This allows for interactive web pages where content updates in response to user actions. Let us explore how to change text and images individually using JavaScript with practical examples. Changing Text of an Element JavaScript provides two main properties for modifying element text content: innerText − Changes or retrieves the plain text content of an element, ignoring HTML tags. innerHTML − Changes or retrieves the HTML content of an element, including any HTML tags within it. ...
Read MoreHow to change the text of a label using JavaScript?
The HTML tag improves web accessibility by providing clickable text descriptions for form elements. In JavaScript, you can dynamically change label text using two properties: innerHTML and innerText. Using the innerHTML Property The innerHTML property allows you to set both text and HTML markup. It's useful when you need to include formatting like bold, italics, or other HTML elements. Syntax selectedElement.innerHTML = "new text with HTML tags"; Example Change Label Text with innerHTML Original label text ...
Read MoreHow to Change the Time Interval of setinterval() Method at RunTime using JavaScript ?
The setInterval() method is used to call a particular block of code repeatedly after a specific time interval. It accepts two parameters: the function to execute and the time interval in milliseconds. Sometimes you need to change this interval dynamically during runtime for irregular or variable timing patterns. JavaScript provides two main approaches to change the time interval of setInterval() at runtime: Using the clearInterval() method Using the setTimeout() method Let us understand both approaches with practical examples. Using the clearInterval() Method The clearInterval() method stops a ...
Read MoreAccess an Element in Type Script
In TypeScript, to access HTML elements, we use the Document Object Model (DOM). The DOM defines an HTML and XML programming interface that visualizes a document's structure as a tree of nodes. Each node in the tree represents document elements like paragraphs, buttons, divs, headings, etc. The document object in TypeScript serves as the doorway to the DOM, allowing us to easily access and manipulate HTML elements. There are several ways to access elements: Using the document.getElementById() method Using the document.querySelector() method Using the document.getElementsByClassName() method ...
Read MoreConditional Properties Using React with TypeScript
In React with TypeScript, conditional properties allow you to pass props to components only when certain conditions are met. This technique is essential for creating dynamic, interactive user interfaces that respond to state changes and user interactions. TypeScript enhances this pattern by providing type safety, ensuring that your conditional props are correctly typed and helping catch potential runtime errors during development. Understanding Conditional Properties Conditional properties are props that are only set on a component under specific conditions. In React with TypeScript, you can implement this using: Ternary operator - Returns one value if condition ...
Read MoreDuck Typing in TypeScript
Duck typing is a programming concept where an object's type is determined by its behavior (methods and properties) rather than its class inheritance. The name comes from the phrase "If it walks like a duck and quacks like a duck, then it must be a duck." What is Duck Typing? Duck typing focuses on what an object can do rather than what it is. If two objects have the same methods and properties, they can be used interchangeably, regardless of their actual class or type. Duck Typing in TypeScript TypeScript implements duck typing through interfaces. An ...
Read MoreFind Hypotenuse of a Number In TypeScript
The longest side of a right-angled triangle and the side that faces away from the right angle is known as the hypotenuse. The Pythagorean theorem states that the hypotenuse's square equals the sum of the squares of the other two sides. The formula is c² = a² + b², where c is the hypotenuse and a and b are the triangle's two sides. In TypeScript, we can create functions to calculate the hypotenuse using the Pythagorean theorem. The function accepts the lengths of the two shorter sides as parameters and returns the hypotenuse length. This only works for right ...
Read More