AttributeToken - bhsd-harry/wikiparser-node GitHub Wiki

目录

Other Languages

简介

扩展和 HTML 标签及表格的单项属性。这个类继承了 Token 类的全部属性和方法,这里不再列出。

✅ 在 MiniBrowser 版本中可用。
🌐 在 Browser 版本中可用。

Properties

balanced

✅ 展开

type: boolean
引号是否匹配。在 MiniBrowser 版本中为只读属性。

// 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"');

name

✅ 展开

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");

tag

✅ 展开

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

✅ 展开

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");

value

展开

type: string | true
getValuesetValue 方法。

// 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 >");

Methods

cloneNode

展开

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

展开

闭合引号。

// close (main)
var attr = Parser.parse('<p id="a>').querySelector("html-attr");
assert.equal(attr, 'id="a');
attr.close();
assert.equal(attr, 'id="a"');

css

展开

加入的版本: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

展开

转义等号。用于模板内。

// 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");

getValue

✅ 展开

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。

// 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",
				},
			],
		},
	],
});

lint

✅ 展开

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,
	},
]);

rename

展开

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");

setValue

展开

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"');

toHtml

展开

加入的版本: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 &quot;"');
⚠️ **GitHub.com Fallback** ⚠️