HtmlToken (EN) - bhsd-harry/wikiparser-node GitHub Wiki
Table of Contents
HTML tags, not matched. This class mixes the properties and methods of the AttributesToken class, and inherits all the properties and methods of the Token class which are not repeated here.
✅ Available in the Mini and Browser versions.
🌐 Available in the Browser version.
✅ Expand
type: string
The name of the tag in lowercase, read-only.
// name
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
assert.strictEqual(firstChild.name, 'b');
✅ Expand
type: boolean
Whether the tag is a closing tag.
// closing
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
assert.ok(!firstChild.closing);
// closing (main)
var {firstChild} = Parser.parse('<b>');
firstChild.closing = true;
assert.equal(firstChild, '</b>');
✅ Expand
type: boolean
Whether the tag is self-closing.
// selfClosing
var {firstChild} = Parser.parse('<br/>');
assert.equal(firstChild, '<br/>');
assert.ok(firstChild.selfClosing);
// selfClosing (main)
var {firstChild} = Parser.parse('<br/>');
firstChild.selfClosing = false;
assert.equal(firstChild, '<br>');
✅ Expand
returns: LintError[]
Report potential grammar errors.
// lint
var [h1, li, i, big, i2, wbr] = Parser.parse(`<h1/></li/><i></big><i>
{|</wbr>
|}`).querySelectorAll('html');
assert.equal(h1, '<h1/>');
assert.equal(li, '</li/>');
assert.equal(i, '<i>');
assert.equal(big, '</big>');
assert.equal(i2, '<i>');
assert.equal(wbr, '</wbr>');
assert.deepStrictEqual(h1.lint(), [
{
rule: 'h1',
severity: 'error',
message: '<h1>',
startLine: 0,
startCol: 0,
startIndex: 0,
endLine: 0,
endCol: 5,
endIndex: 5,
suggestions: [
{
desc: 'h2',
range: [2, 3],
text: '2',
},
],
},
{
rule: 'unmatched-tag',
severity: 'error',
message: 'invalid self-closing tag',
startLine: 0,
startCol: 0,
startIndex: 0,
endLine: 0,
endCol: 5,
endIndex: 5,
suggestions: [
{
desc: 'no self-closing',
range: [3, 4],
text: '',
},
{
desc: 'close',
range: [3, 5],
text: '></h1>',
},
],
},
]);
assert.deepStrictEqual(li.lint(), [
{
rule: 'unmatched-tag',
severity: 'error',
message: 'tag that is both closing and self-closing',
startLine: 0,
startCol: 5,
startIndex: 5,
endLine: 0,
endCol: 11,
endIndex: 11,
suggestions: [
{
desc: 'open',
range: [6, 7],
text: '',
},
{
desc: 'no self-closing',
range: [9, 10],
text: '',
},
],
},
]);
assert.deepStrictEqual(i.lint(), [
{
rule: 'unmatched-tag',
severity: 'warning',
message: 'unclosed tag',
startLine: 0,
startCol: 11,
startIndex: 11,
endLine: 0,
endCol: 14,
endIndex: 14,
},
]);
assert.deepStrictEqual(big.lint(), [
{
rule: 'obsolete-tag',
severity: 'warning',
message: 'obsolete HTML tag',
startLine: 0,
startCol: 14,
startIndex: 14,
endLine: 0,
endCol: 20,
endIndex: 20,
},
{
rule: 'unmatched-tag',
severity: 'error',
message: 'unmatched closing tag',
startLine: 0,
startCol: 14,
startIndex: 14,
endLine: 0,
endCol: 20,
endIndex: 20,
suggestions: [
{
desc: 'remove',
range: [14, 20],
text: '',
},
],
},
]);
assert.deepStrictEqual(i2.lint(), [
{
rule: 'unmatched-tag',
severity: 'error',
message: 'unclosed tag',
startLine: 0,
startCol: 20,
startIndex: 20,
endLine: 0,
endCol: 23,
endIndex: 23,
suggestions: [
{
desc: 'close',
range: [21, 21],
text: '/',
},
],
},
]);
assert.deepStrictEqual(wbr.lint(), [
{
rule: 'parsing-order',
severity: 'error',
message: 'HTML tag in table attributes',
startLine: 1,
startCol: 2,
startIndex: 26,
endLine: 1,
endCol: 8,
endIndex: 32,
fix: {
desc: 'remove',
range: [26, 32],
text: '',
},
},
{
rule: 'unmatched-tag',
severity: 'error',
message: 'tag that is both closing and self-closing',
startLine: 1,
startCol: 2,
startIndex: 26,
endLine: 1,
endCol: 8,
endIndex: 32,
fix: {
desc: 'open',
range: [27, 28],
text: '',
},
},
]);
✅ Expand
returns: this
Find the matching tag.
// findMatchingTag
var {firstChild, lastChild} = Parser.parse('<p></p>');
assert.equal(firstChild, '<p>');
assert.equal(lastChild, '</p>');
assert.strictEqual(firstChild.findMatchingTag(), lastChild);
assert.strictEqual(lastChild.findMatchingTag(), firstChild);
🌐 Expand
Save the syntax tree as JSON.
// json
var {lastChild} = Parser.parse(' <p>');
assert.deepStrictEqual(lastChild.json(), {
range: [1, 4],
type: 'html',
name: 'p',
closing: false,
selfClosing: false,
childNodes: [
{
range: [3, 3],
type: 'html-attrs',
name: 'p',
childNodes: [],
},
],
});
Expand
returns: this
Deep clone the node.
// cloneNode (main)
var {firstChild} = Parser.parse('<p>');
assert.equal(firstChild, '<p>');
assert.deepStrictEqual(firstChild.cloneNode(), firstChild);
Expand
param: string
new tag name
Change the tag name.
// replaceTag (main)
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
firstChild.replaceTag('i');
assert.equal(firstChild, '<i>');
Expand
Fix invalid self-closing tags.
// fix (main)
var {lastChild} = Parser.parse('<b><b/>');
assert.equal(lastChild, '<b/>');
lastChild.fix();
assert.equal(lastChild, '</b>');
Expand
version added: 1.10.0
returns: string
Convert to HTML.
// toHtml (main)
var {firstChild} = Parser.parse('</wbr id=a>');
assert.strictEqual(firstChild.toHtml(), '');
({firstChild} = Parser.parse('</br id=a>'));
assert.strictEqual(firstChild.toHtml(), '<br>');
({firstChild} = Parser.parse('<p id=a />'));
assert.strictEqual(firstChild.toHtml(), '<p id="a">');
({firstChild} = Parser.parse('<li id=a />'));
assert.strictEqual(firstChild.toHtml(), '<li id="a"></li>');