Fluent HTML Tag Builder_html/css_WEB-ITnose
程序员文章站
2024-01-08 18:22:58
...
来自: https://github.com/rwhitmire/tag-builder
tag-builder
Fluent html tag building library.
Install
npm install --save tag-builder
Examples
const assert = require('assert')const TagBuilder = require('tag-builder')const div = new TagBuilder('div')const html = div.text('hello world').toString()assert.equal(html, 'hello world')
const html = TagBuilder .create('input') .attr({ 'type': 'password', 'name': 'password' }) .addClass('form-control') .toString()assert.equal(html, '')
const ul = TagBuilder.create('ul')const li1 = TagBuilder.create('li').text('1')const li2 = TagBuilder.create('li').text('2')ul.appendHtml(li1)ul.appendHtml(li2)const html = ul.toString()assert.equal(html, '
- 1
- 2
Seetests for more examples.
API
All methods except toString() return a TagBuilder instance and are chainable.
create(tagName: string)
Returns a TagBuilder instance.
html(html: any)
Sets innerHTML of the element. You may pass either a string or TagBuilder instance to this method.
appendHtml(html: any)
Appends provided html to inner content. You may pass either a string or TagBuilder instance to this method.
text(text: string)
Sets html encoded innerText of the element.
appendText(text: string)
Appends html encoded text to inner content.
attr(attributes: object)
Merges attributes hash onto the tag.
addClass(className: string)
Merges className onto the tag.
toString()
Returns html string.