JavaScript is a loosely typed programming language, meaning there is no such rule to declare the variable type. A variable can store multiple data types in a program, so it is essential to understand the variable type before using it. In JavaScript, we can use the typeof operator to check the type of a variable or object. The typeof operator takes a variable and returns its type in a string format. In addition, to the typeof operator, JavaScript also provides the instanceof operator to check the type of a variable or object. The instanceof operator accepts two arguments: the ... Read More

Using JavaScript or jQuery, we can check whether a file exists and retrieve metadata about the file, such as its size, content type, last modified date, etc., without retrieving the actual file. The HTTP HEAD request is used in this case. An HTTP HEAD request is a type of HTTP request that asks the server to return the HTTP headers for a specified resource without the actual resource itself. Several methods can be used to send an HTTP HEAD request, but the most popular way is to use the $.ajax() method and XMLHttpRequest object. Users can define the request ... Read More

In the ES6 version of JavaScript, literals are introduced. JavaScript contains object literals, array literals, Numeric literals, RegExp literals, etc. Also, it contains the string literals. The string literal allows us to create multiline strings without any backslash characters, add any word or sentence to the quote, and add variables and mathematical expressions in between the strings. Syntax Users can follow the syntax below to use the template string literal in ECMAScript 6. let string = `This is template literal string!`; In the above syntax, we have used the backticks (` `) to create a template literal string. ... Read More

We can add a fade-out effect using pure JavaScript by manipulating the element's style property. We can start by setting the element's opacity to 1 and then gradually decreasing it over time using the setInterval or setTimeout function. Finally, we can remove the element from the DOM once the opacity reaches 0. Fade-out Effect A fade-out effect is a visual transition where an element gradually becomes less visible over a period of time. This effect is commonly used in web design and animation to create a smooth transition between elements on a page or to hide an element from view. ... Read More

We can add default horizontal scaling to a canvas-type text by accessing the canvas context and setting the scale property to a specific value. This can be done by calling the context's scale method and passing in the desired value for the horizontal scaling. By doing this, all text drawn on the canvas will have the default horizontal scaling applied to it. HTML Canvas HTML canvas is a 2D drawing surface that can be used to create dynamic and interactive graphics, charts, and animations on web pages. It is an HTML element that allows developers to draw graphics using JavaScript. ... Read More

We can use jQuery's 'append' or 'prepend' method to add content to the section of a website. This can be done by selecting the element using jQuery's 'selector' method and then using the appropriate method to add the desired content. Additionally, we can also use JavaScript's 'innerHTML' property to add content to the section. There are quite some ways of adding content to head tag programmatically. Today we are going to discuss 3 of them − Using jQuery's .append() method − Using JavaScript's document.createElement() method − Using JavaScript's insertAdjacentHTML() method − Using these 3 ways ... Read More

We can use the CSS "::before" pseudo-element to dynamically add a comma before each list item, except for the first one. By targeting the list item and using the "content" property, we can insert a comma before the list item's content. Additionally, we can use the ":not(:first-child)" pseudo-class to ensure that only the non-first list items have the comma added. Consider we have the following HTML DOM: Item 1 Item 2 Item 3 Item 4 We will discuss two different approaches in this article that ... Read More

We can use the JavaScript method "createElement" to create a new element. Then, we can use the method "appendChild" to add the element to a parent element on the HTML page. To position the element horizontally, we can use CSS styles such as "display:inline-block" or "float:left/right" on the newly created element. Suppose a situation where we want to depict a graphical representation of a Linked List data structure. Every time the user clicks on a button, a new node, represented by a green circle in our case, should get prepended to the list of nodes horizontally. And the text inside ... Read More

To add a tooltip to a div using JavaScript, first create a function that will generate the tooltip content. Next, add an event listener to the div that will call the function and display the tooltip when the div is hovered over. Finally, use CSS to style the tooltip and position it appropriately. A tooltip is a small text box that appears when a user hovers over a specific element on a webpage, such as a button, link, or image. The tooltip typically contains additional information or context about the element that the user is hovering over. Tooltips are commonly ... Read More

We will learn how to implement multiple input checkbox. The checkbox input selector will have the following functionalities − Multiple options can be selected using the checkbox. Chosen options will be displayed as a separate list. Delete icon will be provided against each chosen option to uncheck / delete that option. Another thing to note is that we will not be using any third-party library to achieve these functionalities and everything will be written in HTML + JavaScript + CSS only. Approach We will have an object whose key will be used as the label for checkbox ... Read More