Modul:HtmlBuilder/dok

HtmlBuilder är ett verktyg för att skapa komplex HTML och CSS-kod genom att skapa en trädstruktur, liknande Document Object Model. Med HtmlBuilder blir programkoden enklare att förstå och lättare att underhålla än om man skulle bara sammanfoga olika strängar.

Användning

Först måste modulen laddas:

local HtmlBuilder = require('Modul:HtmlBuilder')

Skapa sedan en instans av HtmlBuilder:

local builder = HtmlBuilder.create()

Sedan kan du bygga HTML genom att använda de olika metoder som finns, se nästa stycke.

Till slut när du är färdig kan du få resultatet som en HTML-textsträng:

local s = tostring(builder)

Metoder

To allow chaining, all methods return a reference to the builder, unless otherwise stated.

tag

local div = builder.tag('div') Appends a new child node to the builder, and returns an HtmlBuilder instance representing that new node.

done

builder = div.done() Returns the parent node under which the current node was created. Like jQuery.end, this is a convenience function to allow the construction of several child nodes to be chained together into a single statement.

allDone

builder = div.allDone() Like .done(), but traverses all the way to the root node of the tree and returns it.

wikitext

div.wikitext('This is some [[example]] text.') Appends some markup to the node. It may include plain text, wiki markup, and even HTML markup.

newline

div.newline() Appends a newline character to the node. Equivalent to .wikitext('\n').

attr

div.attr('title', 'Attr value') Set an HTML attribute on the node.

css

div.css('color', '#f00') Set a CSS property to be added to the node's style attribute.

cssText

div.cssText('color:#f00; font-size:1.5em') Add some raw CSS to the node's style attribute. This is typically used when a template allows some CSS to be passed in as a parameter, such as the liststyle parameter of {{Navbox}}.

addClass

div.addClass('even') Adds a class name to the node's class attribute. Spaces will be automatically added to delimit each added class name.

Exempel

local HtmlBuilder = require('Modul:HtmlBuilder')

local root = HtmlBuilder.create()

root
    .wikitext('Lorem ')
    .tag('span')
        .css('color', 'red')
        .attr('title', 'ipsum dolor')
        .wikitext('sit amet')
        .done()
    .tag('div')
        .wikitext('consectetur adipisicing')

local s = tostring(root)
-- s = 'Lorem <span style="color:red;" title="ipsum dolor">sit amet</span><div>consectetur adipisicing</div>'