Get DIV Height with Vanilla JavaScript

Abdul Rawoof
Updated on 02-Sep-2022 11:58:51

13K+ Views

The HTML element is represented by the Div Object in the HTML DOM. When styling other HTML elements with CSS or with JavaScript, this tag is used to indicate the container for those elements. The default container for flow content in HTML is the div element. It doesn't affect the content or layout until it is CSS-styled in some way. The height of the div element can be known in many ways. These ways are discussed in this article. Using offsetHeight The offsetHeight is a property which returns the height of the element in pixels. Syntax The syntax of ... Read More

Difference Between Test and Exec Methods in JavaScript

Abdul Rawoof
Updated on 02-Sep-2022 11:55:12

7K+ Views

The RegExp.prototype.test() and RegExp.prototype.exec() methods are the methods in JavaScript used to handle regular expressions. In addition to these two JavaScript includes a number of built-in methods for manipulating and processing text using regular expressions. What are regular expressions? Regular expressions are patterns that are used to search for character combinations in a string. Regular expressions are treated as objects in JavaScript and are denoted by either "regex" or "RegExp." The exec() method The exec() method makes a search for the specified match of the string in the given string. If the match of the string is present in the ... Read More

Difference Between console.dir and console.log in JavaScript

Abdul Rawoof
Updated on 02-Sep-2022 11:43:02

4K+ Views

In JavaScript, dir() and log() are the methods of console object. Console object provides access to the browser’s debugging console. The console.dir() method The console.dir() method output the list of object properties of a specified object in the console to the user. It recognizes the object just as an object and outputs its properties. console.dir shows all properties of a DOM element and can display only one object. Syntax The below syntax is for console.dir method. console.dir(object) Example Following is an example of the console.dir() method in JavaScript − console.dir(673563); console.dir("Welcome to Tutorialspoint"); console.dir(76325 * 476); The console.log() ... Read More

Different Techniques for Copying Objects in JavaScript

Abdul Rawoof
Updated on 02-Sep-2022 11:38:47

357 Views

In JavaScript, objects are the collection of a key value pairs. The properties of the object are the keys and is denoted with a string. The value of the key is the value of the property of the given object. Types/Techniques of object copying There are 2 types of copying objects in any language namely: deep copy, and shallow copy. Shallow Copy In this technique an object is copied as little as possible. For suppose if you copy a collection using this technique the structure of the collection is copied to the destination, not the elements. Example Following is an ... Read More

Change Array Values Using forEach in JavaScript

Abdul Rawoof
Updated on 02-Sep-2022 11:38:10

6K+ Views

Array is a data type which can store multiple elements of similar data types. For example, array is declared as integer data type then it stores one or more elements of the integer data type. In arrays the element can be manipulated when they are in a loop by using any of the mathematical operations or so. For example, if the array elements are numbers, then the numbers can be multiplied by a fixed number or can be added or subtracted also. The change in the array elements can be done by using a user defined program and the result ... Read More

Add Address Element in HTML

Yaswanth Varma
Updated on 02-Sep-2022 11:21:48

1K+ Views

The address tag in HTML identifies a person's or an organization's contact details. The address tag has several meanings when used in different places in an HTML page, such as, when it is used within the tag, it will display the document's contact information; and if it appears inside the tag, it stands in for the article's contact details. This tag will only take global attributes. These attributes belong to every element in the HTML document even though some elements won’t be affected with these. Syntax Address... Note − The address tag must always ... Read More

Use Inline CSS Style for an Element in HTML

Yaswanth Varma
Updated on 02-Sep-2022 11:18:54

439 Views

Using inline CSS we can apply a distinct style to one HTML element at a time. This can be done using the style attribute. Inline CSS always overrides style properties determined in internal or external style sheets. Syntax Following are the examples… Example In the following example we are applying inline style defined within the style attribute of relevant element DOCTYPE html> Hello Everyone Welcome to Tutorialspoint On executing the above script the incline css get activated and applied to the elements in the text. Using JavaScript ... Read More

Create a Shortcut Key to Activate an Element in HTML

Yaswanth Varma
Updated on 02-Sep-2022 11:16:45

3K+ Views

We can design a keyboard shortcut to carry out certain actions, such clicking a link or button, for Displaying the Keyboard text. When defining the element, we may utilise the accesskey attribute to specify a keyboard shortcut for that control element. This attribute must contain at least one printable character, including the accented/other characters that can be inputted using a keyboard. However, different browsers use different ways to activate the accesskey on its platform − Windows Linux INTERNET EXPLORER Alt + key Alt + Shift + key N/A MOZILLA ... Read More

Using Multiple CSS Classes for an Element in HTML

Yaswanth Varma
Updated on 02-Sep-2022 11:13:26

204 Views

To create CSS more quickly, we can give a single HTML element numerous classes and style each class separately. This method allows us to manage style application redundancy. We can apply the universal styles to many classes and the particular class-specific styles. Syntax Example In the following example we are using the style of class”Varma” to both of the paragraphs while the style of secondclass varma1 is applied to second paragraph. DOCTYPE html> .varma { font-size: larger; ... Read More

Free Libraries for Canvas in HTML5

Yaswanth Varma
Updated on 02-Sep-2022 11:10:33

1K+ Views

Using scripting, the canvas element is utilised to create graphics instantly (usually JavaScript). This tag is just introduced in HTML5. The element serves only as a holding area for images. To draw the visuals, you must utilise a script. There are numerous ways to draw pathways, boxes, circles, characters, and add images on a canvas. Syntax Here is the simple HTML example to depict the usage of canvas − DOCTYPE html> var c=document.getElementById("myCanvas"); var ... Read More

Advertisements