AttributeToken (EN)

Table of Contents

• Introduction
• Properties
  • name
  • tag
  • balanced
  • value
• Methods
  • lint
  • getValue
  • cloneNode
  • escape
  • close
  • setValue
  • rename

Other Languages

• 简体中文

Introduction

A single attribute of extension tags, HTML tags and tables.

✅ Available in the Mini and Browser versions.

Properties

name

✅ Expand

type: string
The name of the attribute in lowercase, read-only.

// name
var attr = Parser.parse('<REF name=a/>').querySelector('ext-attr');
assert.equal(attr, 'name=a');
assert.strictEqual(attr.name, 'name');

tag

✅ Expand

type: string
The name of the tag in lowercase, read-only.

// tag
var attr = Parser.parse('<REF name=a/>').querySelector('ext-attr');
assert.equal(attr, 'name=a');
assert.strictEqual(attr.tag, 'ref');

balanced

✅ Expand

type: boolean
Whether the quotes are matched.

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

value

Expand

type: string | true
See getValue and setValue methods.

Methods

lint

✅ Expand

returns: LintError[]
Report potential grammar errors.

// lint
var [lang, tabindex, style] = Parser.parse('<p xml:lang=zh tabindex=1 style="filter:blur(5px)>')
	.querySelectorAll('html-attr');
assert.equal(lang, 'xml:lang=zh');
assert.equal(tabindex, 'tabindex=1');
assert.equal(style, 'style="filter:blur(5px)');
assert.deepStrictEqual(lang.lint(), [
	{
		severity: 'error',
		message: 'illegal attribute name',
		startLine: 0,
		startCol: 3,
		startIndex: 3,
		endLine: 0,
		endCol: 11,
		endIndex: 11,
		excerpt: 'xml:lang',
	},
]);
assert.deepStrictEqual(tabindex.lint(), [
	{
		severity: 'error',
		message: 'nonzero tabindex',
		startLine: 0,
		startCol: 24,
		startIndex: 24,
		endLine: 0,
		endCol: 25,
		endIndex: 25,
		excerpt: '1',
	},
]);
assert.deepStrictEqual(style.lint(), [
	{
		severity: 'warning',
		message: 'unclosed quotes',
		startLine: 0,
		startCol: 32,
		startIndex: 32,
		endLine: 0,
		endCol: 49,
		endIndex: 49,
		excerpt: '"filter:blur(5px)>',
	},
	{
		severity: 'error',
		message: 'insecure style',
		startLine: 0,
		startCol: 33,
		startIndex: 33,
		endLine: 0,
		endCol: 49,
		endIndex: 49,
		excerpt: 'filter:blur(5px)',
	},
]);

getValue

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

cloneNode

Expand

returns: this
Deep clone the node.

// cloneNode
var [ext, html, table] = Parser.parse('<ref name=a/><p id=b>\n{|id=c\n|}')
	.querySelectorAll('ext-attr, html-attr, table-attr');
assert.equal(ext, 'name=a');
assert.equal(html, 'id=b');
assert.equal(table, 'id=c');
assert.deepStrictEqual(ext.cloneNode(), ext);
assert.deepStrictEqual(html.cloneNode(), html);
assert.deepStrictEqual(table.cloneNode(), table);

escape

Expand

Escape equal signs. Used inside templates.

// escape
var attr = Parser.parse('<p id=a>').querySelector('html-attr');
assert.equal(attr, 'id=a');
attr.escape();
assert.equal(attr, 'id{{=}}a');

close

Expand

Close the quotes.

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

setValue

Expand

param: string | boolean Attribute value
Set the value of the attribute.

// setValue
var attr = Parser.parse('<p id=a>').querySelector('html-attr');
assert.equal(attr, 'id=a');
attr.setValue('b');
assert.equal(attr, 'id="b"');
attr.setValue(false);
assert.strictEqual(attr.parentNode, undefined);

rename

Expand

param: string Attribute name
Rename the attribute.

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