AttributeToken (EN)

Table of Contents

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

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

// balanced (main)
var attr = Parser.parse('<p id="a>').querySelector('html-attr');
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, align, style] = Parser.parse(`<p
xml:lang=zh
tabindex=1
align=center
style="cursor:url('cursor.png')>`)
	.querySelectorAll('html-attr');
assert.equal(lang, 'xml:lang=zh');
assert.equal(tabindex, 'tabindex=1');
assert.equal(align, 'align=center');
assert.equal(style, `style="cursor:url('cursor.png')`);
assert.deepStrictEqual(lang.lint(), [
	{
		rule: 'illegal-attr',
		severity: 'error',
		message: 'illegal attribute name',
		startLine: 1,
		startCol: 0,
		startIndex: 3,
		endLine: 1,
		endCol: 8,
		endIndex: 11,
	},
]);
assert.deepStrictEqual(tabindex.lint(), [
	{
		rule: 'illegal-attr',
		severity: 'error',
		message: 'nonzero tabindex',
		startLine: 2,
		startCol: 9,
		startIndex: 24,
		endLine: 2,
		endCol: 10,
		endIndex: 25,
		suggestions: [
			{
				desc: 'remove',
				range: [15, 25],
				text: '',
			},
			{
				desc: '0 tabindex',
				range: [24, 25],
				text: '0',
			},
		],
	},
]);
assert.deepStrictEqual(align.lint(), [
	{
		rule: 'obsolete-attr',
		severity: 'warning',
		message: 'obsolete attribute',
		startLine: 3,
		startCol: 0,
		startIndex: 26,
		endLine: 3,
		endCol: 5,
		endIndex: 31,
	},
]);
assert.deepStrictEqual(style.lint(), [
	{
		rule: 'unclosed-quote',
		severity: 'warning',
		message: 'unclosed quotes',
		startLine: 4,
		startCol: 6,
		startIndex: 45,
		endLine: 4,
		endCol: 31,
		endIndex: 70,
		fix: {
			range: [70, 70],
			text: '"',
		},
	},
	{
		rule: 'insecure-style',
		severity: 'error',
		message: 'insecure style',
		startLine: 4,
		startCol: 7,
		startIndex: 46,
		endLine: 4,
		endCol: 31,
		endIndex: 70,
	},
]);

getValue

✅ Expand

returns: string | true
Get the value of the attribute.

// getValue (main)
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 (main)
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 (main)
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 (main)
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 (main)
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 (main)
var attr = Parser.parse('<p id=a>').querySelector('html-attr');
assert.equal(attr, 'id=a');
attr.rename('class');
assert.equal(attr, 'class=a');

toHtml

Expand

version added: 1.10.0

returns: string
Convert to HTML.

// toHtml (main)
var root = Parser.parse(
		`<p foo style="cursor:url(a.cur)" tabindex=1 id=" a  b " title='c\n"'>`,
	),
	[foo, style, tabindex, id, title] = root.querySelectorAll('html-attr');
assert.strictEqual(foo.toHtml(), '');
assert.strictEqual(style.toHtml(), '');
assert.strictEqual(tabindex.toHtml(), '');
assert.strictEqual(id.toHtml(), 'id="a_b"');
assert.strictEqual(title.toHtml(), 'title="c&#10;&quot;"');