Skip to content

AstElement (EN)

Jump to bottom
bhsd edited this page Jan 26, 2024 · 19 revisions
Table of Contents

Other Languages

Introduction

AstElement is the base class for non-text nodes. It is modeled after the HTMLElement class, and has properties and methods very similar to the HTMLElement class. AstElement inherits all the properties and methods of the AstNode class which are not repeated here.

✅ Available in the Mini and Browser versions.
🌐 Available in the Browser version.

Properties

length

✅ Expand

type: number
Total number of child nodes, read-only.

// length
assert.strictEqual(Parser.parse([[a]]b').length, 2);

children

Expand

type: Token[]
Total number of non-text child nodes, read-only.

// children
var root = Parser.parse([[a]]b'),
	{firstChild} = root;
assert.equal(firstChild, '[[a]]');
assert.deepStrictEqual(root.children, [firstChild]);

firstElementChild

Expand

type: Token
First non-text child node, read-only.

// firstElementChild
var root = Parser.parse([[a]]b'),
	{firstChild} = root;
assert.equal(firstChild, '[[a]]');
assert.strictEqual(root.firstElementChild, firstChild);

lastElementChild

Expand

type: Token
Last non-text child node, read-only.

// lastElementChild
var root = Parser.parse([[a]]b'),
	{firstChild} = root;
assert.equal(firstChild, '[[a]]');
assert.strictEqual(root.lastElementChild, firstChild);

childElementCount

Expand

type: number
Total number of non-text child nodes, read-only.

// childElementCount
assert.strictEqual(Parser.parse([[a]]b').childElementCount, 1);

parentElement

Expand

type: Token
Parent node, alias of the parentNode property, read-only.

outerText

Expand

type: string
Equivalent to the text method, read-only.

hidden

Expand

type: boolean
Whether the node is invisible, read-only.

// hidden
var {firstChild} = Parser.parse('<!--a-->');
assert.equal(firstChild, '<!--a-->');
assert(firstChild.hidden);

nextVisibleSibling

Expand

type: AstNode
Next visible sibling node, read-only.

// nextVisibleSibling
var {firstChild, lastChild} = Parser.parse([[a]]<!--b-->c');
assert.equal(firstChild, '[[a]]');
assert.equal(lastChild, 'c');
assert.strictEqual(firstChild.nextVisibleSibling, lastChild);

previousVisibleSibling

Expand

type: AstNode
Previous visible sibling node, read-only.

// previousVisibleSibling
var {firstChild, lastChild} = Parser.parse('a<!--b-->{{c}}');
assert.equal(firstChild, 'a');
assert.equal(lastChild, '{{c}}');
assert.strictEqual(lastChild.previousVisibleSibling, firstChild);

clientHeight

Expand

type: number
Inner height, only exists when the innerText property is defined, read-only.

// clientHeight
var {firstChild} = Parser.parse('<pre>a\nb</pre>');
assert.equal(firstChild, '<pre>a\nb</pre>');
assert.strictEqual(firstChild.clientHeight, 2);

clientWidth

Expand

type: number
Inner width, only exists when the innerText property is defined, read-only.

// clientWidth
var {firstChild} = Parser.parse('<pre>ab</pre>');
assert.equal(firstChild, '<pre>ab</pre>');
assert.strictEqual(firstChild.clientWidth, 2);

Methods

text

✅ Expand

returns: string
Visible text.

// text
assert.strictEqual(Parser.parse('<!--a-->b').text(), 'b');

normalize

✅ Expand

Merge adjacent text child nodes.

// normalize
var root = Parser.parse('a');
root.append('b');
assert.strictEqual(root.length, 2);
root.normalize();
assert.strictEqual(root.length, 1);

removeAt

✅ Expand

param: number Position of the child node to be removed
returns: AstNode
Remove a child node at the specified position.

// removeAt
var root = Parser.parse([[a]]b');
root.removeAt(0);
assert.equal(root, 'b');

insertAt

✅ Expand

param: AstNode | string Child node to be inserted
param: number Position of the child node to be inserted
returns: AstNode
Insert a child node at the specified position.

// insertAt
var root = Parser.parse('a');
root.insertAt('b', 0);
assert.equal(root, 'ba');

closest

✅ Expand

param: string Selector
Closest ancestor node.

// closest
var root = Parser.parse('[[a]]'),
	{firstChild: link} = root,
	{firstChild} = link;
assert.equal(link, '[[a]]');
assert.equal(firstChild, 'a');
assert.strictEqual(firstChild.closest('root'), root);
assert.strictEqual(firstChild.closest('link'), link);

querySelectorAll

✅ Expand

param: string Selector
returns: Token[]
All descendant nodes that match the selector.

// querySelectorAll
var root = Parser.parse('<p><i>'),
	{firstChild, lastChild} = root;
assert.equal(firstChild, '<p>');
assert.equal(lastChild, '<i>');
assert.deepStrictEqual(root.querySelectorAll('html'), [
	firstChild,
	lastChild,
]);

append

✅ Expand

param: AstNode | string Child node to be inserted
Batch insert child nodes at the end.

// append
var root = Parser.parse('a');
root.append('b','c');
assert.equal(root, 'abc');

replaceChildren

✅ Expand

param: AstNode | string New child nodes
Replace all child nodes.

// replaceChildren
var root = Parser.parse('a[[b]]');
root.replaceChildren('c', 'd');
assert.equal(root, 'cd');

setText

✅ Expand

param: string New text
param: number Position of the text child node to be modified
returns: string
Modify the text child node.

// setText
var root = Parser.parse([[a]]b');
root.setText('c', 1);
assert.equal(root, [[a]]c');

lint

✅ Expand

returns: LintError[]
Report potential grammar errors, see the documentation for each type of nodes for details.

print

🌐 Expand

returns: string
Output in HTML format.

// print
assert.strictEqual(
	Parser.parse('[[a]]').print(),
	'<span class="wpb-root">'
		+ '<span class="wpb-link">'
			+ '[[<span class="wpb-link-target">a</span>]]'
		+ '</span>'
	+ '</span>',
);

json

🌐 Expand

param: string file name
Save the syntax tree as JSON. The saved JSON files are in the printed/ path of wikiparser-node.

// json
assert.deepStrictEqual(Parser.parse('==a==').json(), {
	childNodes: [
		{
			childNodes: [
				{
					childNodes: [
						{
							data: 'a',
						},
					],
					type: 'heading-title',
				},
				{
					childNodes: [
						{
							data: '',
						},
					],
					type: 'heading-trail',
				},
			],
			type: 'heading',
			level: 2,
		},
	],
	type: 'root',
});
assert.deepStrictEqual(Parser.parse('{{{b|B}}}').json(), {
	childNodes: [
		{
			childNodes: [
				{
					childNodes: [
						{
							data: 'b',
						},
					],
					type: 'arg-name',
				},
				{
					childNodes: [
						{
							data: 'B',
						},
					],
					type: 'arg-default',
				},
			],
			name: 'b',
			type: 'arg',
			default: 'B',
		},
	],
	type: 'root',
});
assert.deepStrictEqual(Parser.parse('<br/>').json(), {
	childNodes: [
		{
			childNodes: [
				{
					childNodes: [],
					name: 'br',
					type: 'html-attrs',
				},
			],
			name: 'br',
			type: 'html',
			closing: false,
			selfClosing: true,
		},
	],
	type: 'root',
});
assert.deepStrictEqual(Parser.parse('<!--c').json(), {
	childNodes: [
		{
			childNodes: [
				{
					data: 'c',
				},
			],
			type: 'comment',
			closed: false,
		},
	],
	type: 'root',
});
assert.deepStrictEqual(Parser.parse('{{lc:d}}').json(), {
	childNodes: [
		{
			childNodes: [
				{
					childNodes: [
						{
							data: 'lc',
						},
					],
					type: 'magic-word-name',
				},
				{
					childNodes: [
						{
							childNodes: [],
							type: 'parameter-key',
						},
						{
							childNodes: [
								{
									data: 'd',
								},
							],
							type: 'parameter-value',
						},
					],
					name: '1',
					type: 'parameter',
					anon: true,
				},
			],
			name: 'lc',
			type: 'magic-word',
		},
	],
	type: 'root',
});
assert.deepStrictEqual(Parser.parse('{|\n!e').json(), {
	childNodes: [
		{
			childNodes: [
				{
					childNodes: [
						{
							data: '{|',
						},
					],
					type: 'table-syntax',
				},
				{
					childNodes: [],
					name: 'table',
					type: 'table-attrs',
				},
				{
					childNodes: [
						{
							childNodes: [
								{
									data: '\n!',
								},
							],
							type: 'table-syntax',
						},
						{
							childNodes: [],
							name: 'td',
							type: 'table-attrs',
						},
						{
							childNodes: [
								{
									data: 'e',
								},
							],
							type: 'td-inner',
						},
					],
					type: 'td',
					subtype: 'th',
				},
			],
			type: 'table',
			closed: false,
		},
	],
	type: 'root',
});

destroy

Expand

Destroy the node. Will destroy all ancestor nodes in a chain, so please use the remove method to detach from the parent node before using it.

matches

Expand

param: string Selector
returns: boolean
Check if it matches the selector.

// matches
var {firstChild} = Parser.parse('<br/>');
assert(firstChild.matches('root > :is(#br[selfClosing])'));

querySelector

Expand

param: string Selector
returns: Token
First descendant node that matches the selector.

// querySelector
var root = Parser.parse('<p><i>'),
	{firstChild} = root;
assert.equal(firstChild, '<p>');
assert.strictEqual(root.querySelector('html'), firstChild);

getElementByTypes

Expand

param: string Token types delimited by ,
returns: Token
Select by token type.

// getElementByTypes
var root = Parser.parse([[a]]<i>'),
	{firstChild} = root;
assert.equal(firstChild, '[[a]]');
assert.strictEqual(root.getElementByTypes('html, link'), firstChild);

getElementById

Expand

param: string id
returns: Token
Select by id.

// getElementById
var root = Parser.parse('<p id=a>'),
	{firstChild} = root;
assert.equal(firstChild, '<p id=a>');
assert.strictEqual(root.getElementById('a'), firstChild);

getElementsByClassName

Expand

param: string Class name
returns: Token[]
Select by class name.

// getElementsByClassName
var root = Parser.parse(`{|class="a b"
|}<p class="a c"><pre class="a d"></pre>`),
	{childNodes: [table, html, ext]} = root;
assert.equal(table, '{|class="a b"\n|}');
assert.equal(table.childNodes[1], 'class="a b"');
assert.equal(html, '<p class="a c">');
assert.equal(html.firstChild, ' class="a c"');
assert.equal(ext, '<pre class="a d"></pre>');
assert.equal(ext.firstChild, ' class="a d"');
assert.deepStrictEqual(root.getElementsByClassName('a'), [
	table,
	table.childNodes[1],
	html,
	html.firstChild,
	ext,
	ext.firstChild,
]);

getElementsByTagName

Expand

param: string Tag name
returns: Token[]
Select by tag name.

// getElementsByTagName
var root = Parser.parse('<i></i>'),
	{firstChild, lastChild} = root;
assert.equal(firstChild, '<i>');
assert.equal(lastChild, '</i>');
assert.deepStrictEqual(root.getElementsByTagName('i'), [
	firstChild,
	lastChild,
]);

getLine

Expand

param: number Line number
returns: string
Extract the source text of a line.

// getLine
assert.strictEqual(Parser.parse('a\nb').getLine(1), 'b');

prepend

Expand

param: AstNode | string Child nodes to be inserted
Batch insert child nodes at the beginning.

// prepend
var root = Parser.parse('a');
root.prepend('b','c');
assert.equal(root, 'bca');

removeChild

Expand

param: AstNode Child node to be removed
Remove a child node.

// removeChild
var root = Parser.parse('a');
root.removeChild(root.firstChild);
assert.equal(root, '');

insertBefore

Expand

param: AstNode Child node to be inserted
param: AstNode Reference node
Insert a child node before the specified position.

// insertBefore
var root = Parser.parse('a');
root.insertBefore('b', root.firstChild);
assert.equal(root, 'ba');

echo

Expand

Print the syntax tree in XML format on the command line.

// echo
var root = Parser.parse('[[a]]');
root.echo(); // Please run in a Node.js shell to see the output

相关 NPM 包

WikiLint

对维基文本批量执行语法检查的命令行工具

eslint-plugin-wikitext

用于维基文本的 ESLint 插件

Related NPM Packages

WikiLint

A command-line tool that performs linting on Wikitext in bulk

eslint-plugin-wikitext

ESLint plugin for Wikitext

Clone this wiki locally