Skip to main content

​
Remove attributes

Maizzle can automatically remove attributes from your HTML. By default, it removes empty style and class attributes that are sometimes left over after the CSS inlining process.

​
Usage

You may configure which attributes to remove through the removeAttributes array.

​
Empty values

To remove attributes that have no value, specify the attribute name as a string:
config.js
export default {
  attributes: {
    remove: ['data-src'],
  }
}
Input:
emails/example.html
<img src="example.jpg" data-src alt="">
Output: 
<img src="example.jpg" alt="">
Maizzle automatically removes empty style and class attributes, no need to add them yourself.

​
By name and value

If you know the exact name and value, you may pass them to the array as an object:
config.js
export default {
  attributes: {
    remove: [
      {name: 'id', value: 'test'},
    ],
  }
}
Input: 
<div style="color: #000" id="test">Test</div>
Output: 
<div style="color: #000">Test</div>

​
With a RegExp

You may also use a regular expression for the value. All attributes with a value matching the regex will be removed:
config.js
export default {
  attributes: {
    remove: [
      {name: 'data-id', value: /\d/},
    ],
  }
}
Input: 
<div data-id="test"></div>
<div data-id="99"></div>
Output: 
<div data-id="test"></div>
<div></div>

​
API

app.js
import { removeAttributes } from '@maizzle/framework'

const options = [
  'id',
  {name: 'role', value: 'article'},
]

const html = await removeAttributes(`<div id="" style="" role="article"></div>`, options)

Build docs developers (and LLMs) love

Get started for freeTalk to us