AttributeToken - bhsd-harry/wikiparser-node GitHub Wiki
目录
扩展和 HTML 标签及表格的单项属性。这个类继承了 Token 类的全部属性和方法,这里不再列出。
✅ 在 Mini 和 Browser 版本中可用。
🌐 在 Browser 版本中可用。
✅ 展开
type: boolean
引号是否匹配。在 Mini 和 Browser 版本中为只读属性。
// 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; // 不能设置为 false
assert.equal(attr, 'id="a"');✅ 展开
type: string
小写的属性名,只读。
// 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");✅ 展开
type: string
小写的标签名,只读。
// 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");✅ 展开
type: string
节点类型。
// 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");展开
type: string | true
见 getValue 和 setValue 方法。
// 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 >");展开
returns: this
深拷贝节点。
// 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);展开
闭合引号。
// close (main)
var attr = Parser.parse('<p id="a>').querySelector("html-attr");
assert.equal(attr, 'id="a');
attr.close();
assert.equal(attr, 'id="a"');展开
加入的版本:1.17.1
param: string 属性名
param: string | number | undefined 属性值(可选)
returns: string | undefined
获取某一样式属性的值。
// 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"');展开
转义等号。用于模板内。
// 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");✅ 展开
returns: string | true
获取属性值。
// 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(), "");🌐 展开
将语法树保存为 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",
},
],
},
],
});✅ 展开
returns: LintError[]
报告潜在语法错误。
// 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,
},
]);展开
param: string 新属性名
修改属性名。
// 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");展开
param: string | boolean 属性值
设置属性值。
// 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"');展开
加入的版本:1.10.0
returns: string
转换为 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 ""');