Extracting Data From DOM Elements - jQuery jExtract

File Size: 13.7 KB
Views Total: 1038
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Extracting Data From DOM Elements - jQuery jExtract

The jQuery jExtract plugin provides a function for extracting data from specific DOM elements and returning a JavaScript object of extracted data.

How to use it:

1. Import jQuery library (slim build) and the jExtract plugin into the document.

<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" 
        integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" 
        crossorigin="anonymous">
</script>
<script src="jextract.js"></script>

2. Set the CSS selectors from which you want to extract.

<h1 id="title">jExtract Example</h1>
<h2 id="description">Extract Data From DOM Elements</h2>
var structure = {
    title: "#title", 
    description: "#description"
};

3. Find elements that match selector and extract data from them.

var data = jExtract(structure);

4. This will return a JS object containing key-value pairs as these:

{
  title: "jExtract Example",
  description: "Extract Data From DOM Elements."
}

Change log:

2018-01-09

  • v0.0.7

2017-12-13

  • v0.0.4

This awesome jQuery plugin is developed by kormanowsky. For more Advanced Usages, please check the demo page or visit the official website.