Dataset of JavaScript

Dataset of JavaScript
Techiio-author
Written by Sagar RabidasDecember 18, 2021
7 min read
JavaScript
0 VIEWS 0 LIKES 0 DISLIKES SHARE
0 LIKES 0 DISLIKES 0 VIEWS SHARE
Techiio-author
Sagar Rabidas

Software Developer

In this blog, we will discuss the Dataset of JavaScript.

JavaScript:-

Javascript is the maximum famous programming language for internet improvement. Javascript is additionally known as JS is a high-degree interpreted scripting programming language that is used in net development. Not like different popular programming languages that use a compiler to bring together the language, javascript makes use of an interpreter to transform javascript to gadget code.

Javascript’s idea turned into design via Brendan Eich in 10 days in May 1995. The primary official call of javascript became LiveScript and became shipped in Netscape navigator 2.0. Javascript firstly managed with the aid of Netscape is presently controlled by way of Mozilla foundation. In 1997, javascript changed into regularly occurring by way of ECMA worldwide and became a general. The present-day model of javascript in ECMAScript 2019.

blogpost

Definition of Dataset JavaScript

  • The dataset JavaScript is a document-oriented module (DOM) property to access the data attribute and set it on the JavaScript element.
  • It is a DOM interface to set data elements on the application using JavaScript language.
  • It is a property to gives read-only access for data attributes but does not access write property directly.
  • It sets the data in the attribute and reads this data using JavaScript events.
  • It is a function of the data attribute to store data privately for read-only purposes using JavaScript technology.
  • The property access and set multiple data attributes but the property name cannot be the same.
  • It provides the “map of DOMString” to access each attribute and converts any data into a string.

Syntax:

The basic syntax is shown below.

<body>
<div id = "id_name" data-tagName = "value" data-tagName1 = "value">
Display Data
</div>
<script>
const variable_name = document.getElementById('id_name');
console.log(variable_name.dataset);
</script>
</body>

Description:

  • You can initialize the value in the HTML tag.
  • Use dataset property in the output element.
  • The console shows you given value.
  • You can read-only values in the console.

Set extra value syntax is shown below.

<body>
<div id = "id_name" data-tagName = "value" data-tagName1 = " ">
Display Data
</div>
<script>
const variable_name = document.getElementById('id_name');
variable_name.dataset.tagName1 = "value";
</script>
</body>

Description:

  • The dataset converts the set value into a string value.
  • If the tag value is null then the dataset set values.

The basic naming syntax is shown below.

<body>
<div id = "id_name" data-tagname = "value" data-tag-number = "value">
Display Data
</div>
<script>
const variable_name = document.getElementById('id_name');
variable_name.dataset.tagname = "value";
variable_name.dataset.tagNumber = "value";
</script>
</body>

Description:

  • The name requires “data-” in the dataset property.
  • If the tag name is a “data-tag name” then the dataset property uses “dataset. tag name”.
  • If the tag name is a “data-tag-name” then the dataset property uses “dataset.tagName”.

The basic dataset in javascript with delete unwanted dataset syntax shows below.

<body>
<div id = "id_name" data-tagName = "value" data-tagName1 = "value">
Display Data
</div>
<script>
const variable_name = document.getElementById('id_name');
delete variable_name.dataset.tagName;
</script>
</body>

Description:

  • The “delete” keyword requires for removing the dataset attribute.
  • This keyword works before dataset property.

How does the dataset work in JavaScript?

  • Create HTML file for dataset JavaScript.

Filename: dataset.html

  • Create HTML tags and initialize dataset values in a required format.
<div id = "student" data-phone = "9814567890" data-name >
Student
</div>
  • Add JavaScript event elements and interconnect with the HTML tag.
const student = document.getElementById('student');
  • If you want to set the value with dataset property.
student.dataset.name = 'Adam';
  • If you want to delete the value with the dataset property.
delete student.dataset.name;
  • Read the dataset value in the console log of the HTML page.
console.log(student.dataset);
  1. Combine the working procedure of the dataset in JavaScript.
<!DOCTYPE html>
<html>
<body>
<div id = "student" data-phone = "1234567890" data-name = "student"> student </div>
<script>
const student = document.getElementById('student');
console.log(student.dataset);
</script>
</body>
</html>

Example:-

The basic dataset in JavaScript example and the output shown below

<!DOCTYPE html>
<html>
<head>
<title> dataset in JavaScript</title>
</head>
<body>
<div id = "student" data-phone = "9814567890" data-name = "student"> dataset javascript </div>
<script>
const student = document.getElementById('student');
console.log(student.dataset);
</script>
</body>
</html>

JavaScript
JavaScript Dataset
database
0 VIEWS 0 LIKES 0 DISLIKES SHARE
0 LIKES 0 DISLIKES 0 VIEWS SHARE
Was this blog helpful?
techiio-price-plantechiio-price-plantechiio-price-plantechiio-price-plantechiio-price-plan
You must be Logged in to comment
Code Block
Techiio-logo

Techiio is on the journey to build an ocean of technical knowledge, scouring the emerging stars in process and proffering them to the corporate world.

Follow us on:

Subscribe to get latest updates

You can unsubscribe anytime from getting updates from us
Developed and maintained by Wikiance
Developed and maintained by Wikiance