# attr

Type:

\<string\> \| \<string\[\]\>

\
Default: 'html'\
Values:

[](https://developer.mozilla.org/en-US/docs/Web/API/Element/tagName)

tagName

\| [](https://developer.mozilla.org/en-US/docs/Web/API/Node/nodeName)

nodeName

\| 'html' \| 'outerHTML' \| 'text' \| 'markdown' \| 'val'

It specifies how the value should be extracted from the matched [selector](https://microlink.io/docs/mql/data/selector):

    const mql = require('@microlink/mql')

    const github = username =>
      mql(`https://github.com/${username}`, {
        data: {
          avatar: {
            selector: 'meta[property="og:image"]:not([content=""])',
            attr: 'content',
            type: 'image'
          }
        }
      })

    const username = 'kikobeats'
    const { response, data } = await github(username)

    console.log(
      `GitHub avatar for @${username}: ${data.avatar.url} (${data.avatar.size_pretty})`
    )

Any [](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes)

HTML attribute

is supported, plus the following special cases:

- 'html': Get the inner HTML content of the matched selector.
- 'outerHTML': Get the outer HTML of the matched selector, including the element itself.
- 'text': Returns the combined text content, including its descendants, by removing leading, trailing, and repeated whitespace.
- 'markdown': Converts the HTML content into Markdown, preserving headings, links, and formatting.
- 'val': Get the current value of the matched selector, oriented for select or input fields.

## [Whole-page serialization](https://microlink.io/docs/mql/data/attr#whole-page-serialization)

When [selector](https://microlink.io/docs/mql/data/selector) is omitted, `attr` operates on the entire page. This is useful for serializing a full page into a new output format:

    const mql = require('@microlink/mql')

    const { data } = await mql('https://example.com', {
      data: {
        content: {
          attr: 'markdown'
        }
      }
    })

    console.log(data.content)
    // => '# Example Domain\n\nThis domain is for use in illustrative examples…'

You can also scope the conversion to a specific element by combining `selector` with `attr`:

    const mql = require('@microlink/mql')

    const { data } = await mql('https://example.com', {
      data: {
        article: {
          selector: 'article',
          attr: 'markdown'
        }
      }
    })

    console.log(data.article)
    // => '# Article Title\n\nArticle content as markdown…'

## [Fallback values](https://microlink.io/docs/mql/data/attr#fallback-values)

If you specify more than one value, they will be used as fallback values:

    const mql = require('@microlink/mql')

    const github = username =>
      mql(`https://github.com/${username}`, {
        data: {
          avatar: [
            {
              selector: 'meta[name="twitter:image:src"]:not([content=""])',
              attr: 'content',
              type: 'image'
            },
            {
              selector: 'meta[property="og:image"]:not([content=""])',
              attr: 'content',
              type: 'image'
            }
          ]
        }
      })

    const username = 'kikobeats'
    const { response, data } = await github(username)

    console.log(
      `GitHub avatar for @${username}: ${data.avatar.url} (${data.avatar.size_pretty})`
    )

The first attribute that resolves a value will be used.