attr

Type: string|string[]
Default: html
Values: or html|val|text
Get the value of an attribute from the matched selector that should be picked.
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>kikobeats.com</title>
  </head>
  <body>
    <h1>
      Hey, I'm <span>Kiko Beats</span>, a millennial doing stuff on internet.
    </h1>
    <img id="avatar" src="https://kikobeats.com/images/avatar-glitch.jpg" />
  </body>
</html>
const mql = require('@microlink/mql')
const { data } mql(`https://kikobeats.com`, {
  data: {
    avatar: {
      selector: '#avatar',
      attr: 'src'
    }
  }
})
{
  "data": {
    "avatar": "https://kikobeats.com/images/avatar-glitch.jpg"
  }
}

If you want to extract an img, probably you are interested in src property, so you should specify it.

Any is supported, keeping in mind three special values:
  • text: Get the combined text contents of the matched selector, including their descendants.
  • html: Get the HTML contents of the matched selector.
  • val: Get the current value of the matched selector.
If you don't define the attribute, html will be used by default.
Specify a collection of attributes is supported as well, being important the position of the attribute since only the first truth and value will be got.
const mql = require('@microlink/mql')
const {data } mql(`https://twitter.com/${username}`, {
  data: {
    avatar: {
      selector: '#avatar'
      attr: ['src', 'data-load']
    }
  }
})

If you don't define the attribute, `html` will be used by default.

Nested Structures

You can use attr for mapping nested structures, being it useful for groupoing values over the same property name.
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Best Chocolate Chip Cookies</title>
  </head>
  <body>
    <ul>
      <li>
        <span class="quantity">1 cup</span>
        <p class="ingredient">Butter</p>
      </li>
      <li>
        <span class="quantity">1 cup</span>
        <p class="ingredient">Sugar</p>
      </li>
      <li>
        <span class="quantity">2 units</span>
        <p class="ingredient">Eggs</p>
      </li>
    </ul>
  </body>
</html>
const mql = require('@microlink/mql')
const {data } mql(`https://bestcookie.recipe`, {
  data: {
    ingredients: {
      selector: 'li',
      attr: {
        ingredient: { selector: '.ingredient', attr: 'text' },
        quantity: { selector: '.quantity', attr: 'text' }
      }
    }
  }
})
{
  "data": {
    "ingredients": [
      { "ingredient": "Butter", "quantity": "1 cup" },
      { "ingredient": "Sugar", "quantity": "1 cup" },
      { "ingredient": "Eggs", "quantity": "2 units" }
    ]
  }
}

attr

Type: string|string[]
Default: html
Values: or html|val|text
Get the value of an attribute from the matched selector that should be picked.
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>kikobeats.com</title>
  </head>
  <body>
    <h1>
      Hey, I'm <span>Kiko Beats</span>, a millennial doing stuff on internet.
    </h1>
    <img id="avatar" src="https://kikobeats.com/images/avatar-glitch.jpg" />
  </body>
</html>
const mql = require('@microlink/mql')
const { data } mql(`https://kikobeats.com`, {
  data: {
    avatar: {
      selector: '#avatar',
      attr: 'src'
    }
  }
})
{
  "data": {
    "avatar": "https://kikobeats.com/images/avatar-glitch.jpg"
  }
}

If you want to extract an img, probably you are interested in src property, so you should specify it.

Any is supported, keeping in mind three special values:
  • text: Get the combined text contents of the matched selector, including their descendants.
  • html: Get the HTML contents of the matched selector.
  • val: Get the current value of the matched selector.
If you don't define the attribute, html will be used by default.
Specify a collection of attributes is supported as well, being important the position of the attribute since only the first truth and value will be got.
const mql = require('@microlink/mql')
const {data } mql(`https://twitter.com/${username}`, {
  data: {
    avatar: {
      selector: '#avatar'
      attr: ['src', 'data-load']
    }
  }
})

If you don't define the attribute, `html` will be used by default.

Nested Structures

You can use attr for mapping nested structures, being it useful for groupoing values over the same property name.
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <title>Best Chocolate Chip Cookies</title>
  </head>
  <body>
    <ul>
      <li>
        <span class="quantity">1 cup</span>
        <p class="ingredient">Butter</p>
      </li>
      <li>
        <span class="quantity">1 cup</span>
        <p class="ingredient">Sugar</p>
      </li>
      <li>
        <span class="quantity">2 units</span>
        <p class="ingredient">Eggs</p>
      </li>
    </ul>
  </body>
</html>
const mql = require('@microlink/mql')
const {data } mql(`https://bestcookie.recipe`, {
  data: {
    ingredients: {
      selector: 'li',
      attr: {
        ingredient: { selector: '.ingredient', attr: 'text' },
        quantity: { selector: '.quantity', attr: 'text' }
      }
    }
  }
})
{
  "data": {
    "ingredients": [
      { "ingredient": "Butter", "quantity": "1 cup" },
      { "ingredient": "Sugar", "quantity": "1 cup" },
      { "ingredient": "Eggs", "quantity": "2 units" }
    ]
  }
}

By using this website you agree to ourprivacy.