AttributeToken (EN) - bhsd-harry/wikiparser-node GitHub Wiki
Table of Contents
A single attribute of extension tags, HTML tags and tables. This class 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: boolean
Whether the quotes are matched. Read-only in the Mini and Browser versions.
// balanced
var attr = Parser.parse("<poem compact/>").querySelector("ext-attr");
assert.equal(attr, "compact");
assert.ok(attr.balanced);
attr = Parser.parse("<br id=a/>").querySelector("html-attr");
assert.equal(attr, "id=a");
assert.ok(attr.balanced);
attr = Parser.parse('{|class="wikitable').querySelector("table-attr");
assert.equal(attr, 'class="wikitable');
assert.ok(!attr.balanced);// balanced (main)
var attr = Parser.parse('<p id="a>').querySelector("html-attr");
attr.balanced = true;
assert.equal(attr, 'id="a"');
attr.balanced = false; // cannot set to false
assert.equal(attr, 'id="a"');✅ Expand
type: string
The name of the attribute in lowercase, read-only.
// name
var attr = Parser.parse("<poem COMPACT/>").querySelector("ext-attr");
assert.equal(attr, "COMPACT");
assert.strictEqual(attr.name, "compact");
attr = Parser.parse("<br data-a = a/>").querySelector("html-attr");
assert.equal(attr, "data-a = a");
assert.strictEqual(attr.name, "data-a");
attr = Parser.parse('{|cla<!-- -->ss="wikitable"').querySelector("table-attr");
assert.equal(attr, 'cla<!-- -->ss="wikitable"');
assert.strictEqual(attr.name, "class");✅ Expand
type: string
The name of the tag in lowercase, read-only.
// tag
var attr = Parser.parse("<POEM compact/>").querySelector("ext-attr");
assert.equal(attr, "compact");
assert.strictEqual(attr.tag, "poem");
attr = Parser.parse("<br id=a/>").querySelector("html-attr");
assert.equal(attr, "id=a");
assert.strictEqual(attr.tag, "br");
attr = Parser.parse('{|\n!class="b"|').querySelector("td")
.querySelector("table-attr");
assert.equal(attr, 'class="b"');
assert.strictEqual(attr.tag, "th");✅ Expand
type: string
Type of the token.
// type
var attr = Parser.parse("<poem compact/>").querySelector("ext-attr");
assert.equal(attr, "compact");
assert.strictEqual(attr.type, "ext-attr");
attr = Parser.parse("<br id=a/>").querySelector("html-attr");
assert.equal(attr, "id=a");
assert.strictEqual(attr.type, "html-attr");
attr = Parser.parse('{|class="wikitable"').querySelector("table-attr");
assert.equal(attr, 'class="wikitable"');
assert.strictEqual(attr.type, "table-attr");Expand
type: string | true
See getValue and setValue methods.
// value (main)
var root = Parser.parse("<p id=a>"),
attr = root.querySelector("html-attr");
assert.equal(attr, "id=a");
assert.strictEqual(attr.value, "a");
attr.value = "b";
assert.equal(attr, 'id="b"');
attr.value = false;
assert.strictEqual(attr.parentNode, undefined);
assert.equal(root, "<p >");Expand
returns: this
Deep clone the node.
// cloneNode (main)
var attr = Parser.parse("<ref name=a/>").querySelector("ext-attr");
assert.equal(attr, "name=a");
assert.deepStrictEqual(attr.cloneNode(), attr);
attr = Parser.parse("<p id=b>").querySelector("html-attr");
assert.equal(attr, "id=b");
assert.deepStrictEqual(attr.cloneNode(), attr);
attr = Parser.parse("{|id=c").querySelector("table-attr");
assert.equal(attr, "id=c");
assert.deepStrictEqual(attr.cloneNode(), attr);Expand
Close the quotes.
// close (main)
var attr = Parser.parse('<p id="a>').querySelector("html-attr");
assert.equal(attr, 'id="a');
attr.close();
assert.equal(attr, 'id="a"');Expand
version added: 1.17.1
param: string property name
param: string | number | undefined property value (optional)
returns: string | undefined
Get the value of a style property.
// css (main)
var root = Parser.parse("<p style=margin:auto;margin:0;>"),
style = root.querySelector("html-attr");
assert.equal(style, "style=margin:auto;margin:0;");
assert.strictEqual(style.css("margin"), "0");
style.css("margin", "0 0");
assert.equal(style, 'style="margin:auto;margin:0 0;"');
style.css("margin", "");
assert.equal(style, 'style=""');
style.css("padding", "0");
assert.equal(style, 'style="padding: 0"');
style.css("left", 0);
assert.equal(style, 'style="padding: 0; left: 0"');
style.css("right", "");
assert.equal(style, 'style="padding: 0; left: 0"');
style.css("padding", "");
assert.equal(style, 'style="left: 0"');Expand
Escape equal signs. Used inside templates.
// escape (main)
var attr = Parser.parse("<p id=a>").querySelector("html-attr");
assert.equal(attr, "id=a");
attr.escape();
assert.equal(attr, "id{{=}}a");
attr = Parser.parse("<pre id=b/>").querySelector("ext-attr");
assert.equal(attr, "id=b");
attr.escape();
assert.equal(attr, "id=b");✅ Expand
returns: string | true
Get the value of the attribute.
// getValue
var attr = Parser.parse('<p id=" a ">').querySelector("html-attr");
assert.equal(attr, 'id=" a "');
assert.strictEqual(attr.getValue(), "a");
attr = Parser.parse("<poem compact/>").querySelector("ext-attr");
assert.equal(attr, "compact");
assert.strictEqual(attr.getValue(), true);
attr = Parser.parse("<p id>").querySelector("html-attr");
assert.equal(attr, "id");
assert.strictEqual(attr.getValue(), "");🌐 Expand
Save the syntax tree as JSON.
// json (print)
var attr = Parser.parse("<p id=a>").querySelector("html-attr");
assert.equal(attr, "id=a");
assert.deepStrictEqual(attr.json(), {
range: [3, 7],
type: "html-attr",
name: "id",
tag: "p",
childNodes: [
{
range: [3, 5],
type: "attr-key",
childNodes: [
{
range: [3, 5],
data: "id",
},
],
},
{
range: [6, 7],
type: "attr-value",
childNodes: [
{
range: [6, 7],
data: "a",
},
],
},
],
});✅ Expand
returns: LintError[]
Report potential grammar errors.
// lint
var attr = Parser.parse("<p xml:lang=zh>").querySelector("html-attr");
assert.equal(attr, "xml:lang=zh");
assert.deepStrictEqual(attr.lint(), [
{
rule: "illegal-attr",
severity: "error",
message: "invalid attribute name",
startLine: 0,
startCol: 3,
startIndex: 3,
endLine: 0,
endCol: 11,
endIndex: 11,
suggestions: [
{
desc: "remove",
range: [3, 14],
text: "",
},
],
},
]);
attr = Parser.parse(`<p style="cursor:url('cursor.png')">`)
.querySelector("html-attr");
assert.equal(attr, `style="cursor:url('cursor.png')"`);
assert.deepStrictEqual(attr.lint(), [
{
rule: "insecure-style",
severity: "error",
message: "insecure style",
startLine: 0,
startCol: 10,
startIndex: 10,
endLine: 0,
endCol: 34,
endIndex: 34,
},
]);
attr = Parser.parse('<p tabindex="1">').querySelector("html-attr");
assert.equal(attr, 'tabindex="1"');
assert.deepStrictEqual(attr.lint(), [
{
rule: "illegal-attr",
severity: "error",
message: "nonzero tabindex",
startLine: 0,
startCol: 13,
startIndex: 13,
endLine: 0,
endCol: 14,
endIndex: 14,
suggestions: [
{
desc: "remove",
range: [3, 15],
text: "",
},
{
desc: "0 tabindex",
range: [13, 14],
text: "0",
},
],
},
]);
attr = Parser.parse("<p dir=unknown>").querySelector("html-attr");
assert.equal(attr, "dir=unknown");
assert.deepStrictEqual(attr.lint(), [
{
rule: "illegal-attr",
severity: "error",
message: "invalid attribute value",
startLine: 0,
startCol: 7,
startIndex: 7,
endLine: 0,
endCol: 14,
endIndex: 14,
},
]);
attr = Parser.parse('<p id="a>').querySelector("html-attr");
assert.equal(attr, 'id="a');
assert.deepStrictEqual(attr.lint(), [
{
rule: "unclosed-quote",
severity: "warning",
message: "unclosed quotes",
startLine: 0,
startCol: 6,
startIndex: 6,
endLine: 0,
endCol: 8,
endIndex: 8,
suggestions: [
{
range: [8, 8],
text: '"',
desc: "close",
},
],
},
]);
attr = Parser.parse("<p align=center>").querySelector("html-attr");
assert.equal(attr, "align=center");
assert.deepStrictEqual(attr.lint(), [
{
rule: "obsolete-attr",
severity: "warning",
message: "obsolete attribute",
startLine: 0,
startCol: 3,
startIndex: 3,
endLine: 0,
endCol: 8,
endIndex: 8,
},
]);// lint (Node.js)
var attr = Parser.parse('<br style="foo">').querySelector("html-attr");
assert.equal(attr, 'style="foo"');
assert.deepStrictEqual(attr.lint(), [
{
rule: "invalid-css",
code: "css-semicolonexpected",
severity: "error",
message: "semi-colon expected",
startLine: 0,
startCol: 14,
startIndex: 14,
endLine: 0,
endCol: 14,
endIndex: 14,
},
{
rule: "invalid-css",
code: "css-colonexpected",
severity: "error",
message: "colon expected",
startLine: 0,
startCol: 14,
startIndex: 14,
endLine: 0,
endCol: 14,
endIndex: 14,
},
]);
attr = Parser.parse('<br style="-moz-border-radius: 0">')
.querySelector("html-attr");
assert.equal(attr, 'style="-moz-border-radius: 0"');
assert.deepStrictEqual(attr.lint(), [
{
rule: "invalid-css",
code: "vendorPrefix",
severity: "warning",
message:
"Also define the standard property 'border-radius' for compatibility",
startLine: 0,
startCol: 11,
startIndex: 11,
endLine: 0,
endCol: 29,
endIndex: 29,
},
]);Expand
param: string Attribute name
Rename the attribute.
// rename (main)
var attr = Parser.parse("<p id=a>").querySelector("html-attr");
assert.equal(attr, "id=a");
attr.rename("class");
assert.equal(attr, "class=a");
attr.rename("{{{1}}}");
assert.equal(attr, "{{{1}}}=a");Expand
param: string | boolean Attribute value
Set the value of the attribute.
// setValue (main)
var root = Parser.parse("<p id=a>"),
attr = root.querySelector("html-attr");
assert.equal(attr, "id=a");
attr.setValue("b");
assert.equal(attr, 'id="b"');
attr.setValue('"');
assert.equal(attr, `id='"'`);
attr.setValue(true);
assert.equal(attr, "id");
attr.setValue(false);
assert.strictEqual(attr.parentNode, undefined);
assert.equal(root, "<p >");
attr = Parser.parse("{{template|<p id>}}").querySelector("html-attr");
assert.equal(attr, "id");
attr.setValue("a");
assert.equal(attr, 'id{{=}}"a"');Expand
version added: 1.10.0
returns: string
Convert to HTML.
// toHtml (main)
var attr = Parser.parse("<poem compact/>").querySelector("ext-attr");
assert.equal(attr, "compact");
assert.strictEqual(attr.toHtml(), "");
attr = Parser.parse("<p dir=unknown>").querySelector("html-attr");
assert.equal(attr, "dir=unknown");
assert.strictEqual(attr.toHtml(), "");
attr = Parser.parse('<p id=" ">').querySelector("html-attr");
assert.equal(attr, 'id=" "');
assert.strictEqual(attr.toHtml(), "");
attr = Parser.parse('<p aria-describedby=" a b ">')
.querySelector("html-attr");
assert.equal(attr, 'aria-describedby=" a b "');
assert.strictEqual(attr.toHtml(), 'aria-describedby="a b"');
attr = Parser.parse('<p id=" a b ">').querySelector("html-attr");
assert.equal(attr, 'id=" a b "');
assert.strictEqual(attr.toHtml(), 'id="a_b"');
attr = Parser.parse(`<p title=' a\n\n" '>`).querySelector("html-attr");
assert.equal(attr, `title=' a\n\n" '`);
assert.strictEqual(attr.toHtml(), 'title="a ""');