Home > Web Front-end > HTML Tutorial > Fluent HTML Tag Builder_html/css_WEB-ITnose

Fluent HTML Tag Builder_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:27:05
Original
1020 people have browsed it

来自: https://github.com/rwhitmire/tag-builder

tag-builder

Fluent html tag building library.

Install

npm install --save tag-builder
Copy after login

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, '<div>hello world</div>')
Copy after login
const html = TagBuilder  .create('input')  .attr({    'type': 'password',    'name': 'password'  })  .addClass('form-control')  .toString()assert.equal(html, '<input type="password" name="password" class="form-control">')
Copy after login
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, '<ul><li>1</li><li>2</li></ul>')
Copy after login

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.

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template