AttributesToken

目录

• 简介
• Properties
  • name
  • attributes
  • className
  • classList
  • id
  • sanitized
• Methods
  • getAttrTokens
  • getAttrToken
  • getAttr
  • lint
  • sanitize
  • cloneNode
  • setAttr
  • hasAttr
  • getAttrNames
  • getAttrs
  • removeAttr
  • toggleAttr

Other Languages

• English

简介

扩展和 HTML 标签及表格的属性。

✅ 在 Mini 和 Browser 版本中可用。

Properties

name

✅ 展开

type: string
小写的标签名，只读。

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

attributes

展开

type: Record<string, string | true>
见 getAttrs 方法，只读。

className

展开

type: string
以字符串表示的 class 属性。

// className
var attrs = Parser.parse('<p class="a b">').querySelector('html-attrs');
assert.equal(attrs, ' class="a b"');
assert.strictEqual(attrs.className, 'a b');
attrs.className = 'a';
assert.equal(attrs, ' class="a"');

classList

展开

type: Set<string>
以 Set 表示的 class 属性，只读。

// classList
var attrs = Parser.parse('{|class="a b"\n|}').querySelector('table-attrs');
assert.equal(attrs, 'class="a b"');
assert.deepStrictEqual(attrs.classList, new Set(['a', 'b']));

id

展开

type: string
id 属性。

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

sanitized

展开

type: boolean
是否含有无效属性，只读。

// sanitized
var attrs = Parser.parse('{|id=a | class=b\n|}').querySelector('table-attrs');
assert.equal(attrs, 'id=a | class=b');
assert(!attrs.sanitized);

Methods

getAttrTokens

✅ 展开

param: string 属性名
returns: AttributeToken[]
所有指定属性名的 AttributeToken。

// getAttrTokens
var attrs = Parser.parse('<p id=a>').querySelector('html-attrs'),
	attr = attrs.querySelector('html-attr');
assert.equal(attrs, ' id=a');
assert.equal(attr, 'id=a');
assert.deepStrictEqual(attrs.getAttrTokens('id'), [attr]);

getAttrToken

✅ 展开

param: string 属性名
returns: AttributeToken
指定属性名的最后一个 AttributeToken。

// getAttrToken
var attrs = Parser.parse('<p id=a id=b>').querySelector('html-attrs'),
	[, attr] = attrs.querySelectorAll('html-attr');
assert.equal(attrs, ' id=a id=b');
assert.equal(attr, 'id=b');
assert.deepStrictEqual(attrs.getAttrToken('id'), attr);

getAttr

✅ 展开

param: string 属性键
returns: string | true
获取指定属性。

// getAttr
var attrs = Parser.parse('<gallery mode="slideshow" showthumbnails></gallery>')
	.querySelector('ext-attrs');
assert.equal(attrs, ' mode="slideshow" showthumbnails');
assert.strictEqual(attrs.getAttr('mode'), 'slideshow');
assert.strictEqual(attrs.getAttr('showthumbnails'), true);

lint

✅ 展开

returns: LintError[]
报告潜在语法错误。

// lint
var attrs = Parser.parse('</p id=a / id=b>').querySelector('html-attrs');
assert.equal(attrs, ' id=a / id=b');
assert.deepStrictEqual(attrs.lint(), [
	{
		severity: 'error',
		message: 'attributes of a closing tag',
		startLine: 0,
		startCol: 3,
		startIndex: 3,
		endLine: 0,
		endCol: 15,
		endIndex: 15,
	},
	{
		severity: 'error',
		message: 'containing invalid attribute',
		startLine: 0,
		startCol: 8,
		startIndex: 8,
		endLine: 0,
		endCol: 11,
		endIndex: 11,
	},
	{
		severity: 'error',
		message: 'duplicated id attribute',
		startLine: 0,
		startCol: 4,
		startIndex: 4,
		endLine: 0,
		endCol: 8,
		endIndex: 8,
	},
	{
		severity: 'error',
		message: 'duplicated id attribute',
		startLine: 0,
		startCol: 11,
		startIndex: 11,
		endLine: 0,
		endCol: 15,
		endIndex: 15,
	},
]);

sanitize

展开

清理无效属性。

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

cloneNode

展开

returns: this
深拷贝节点。

// cloneNode
var [ext, html, table] = Parser.parse('<ref name=a/><p id=b>\n{|id=c\n|}')
	.querySelectorAll('ext-attrs, html-attrs, table-attrs');
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);

setAttr

展开

param: string | Record<string, string | boolean> 属性键或属性对象
param: string | boolean 属性值
设置指定属性。

// setAttr
var attrs = Parser.parse('<p id=a>').querySelector('html-attrs');
assert.equal(attrs, ' id=a');
attrs.setAttr('title', 'b');
attrs.setAttr('id', false);
assert.equal(attrs, '  title="b"');
attrs.setAttr({title: false, id: 'a'});
assert.equal(attrs, '  id="a"');

hasAttr

展开

param: string 属性键
returns: boolean
标签是否具有某属性。

// hasAttr
var attrs = Parser.parse('<p id=a>').querySelector('html-attrs');
assert.equal(attrs, ' id=a');
assert(attrs.hasAttr('id'));
assert(!attrs.hasAttr('title'));

getAttrNames

展开

returns(): Set<string>
获取全部的属性名。

// getAttrNames
var attrs = Parser.parse('<p id=a title=b>').querySelector('html-attrs');
assert.equal(attrs, ' id=a title=b');
assert.deepStrictEqual(attrs.getAttrNames(), new Set(['id', 'title']));

getAttrs

展开

returns: Record<string, string | true>
获取全部属性。

// getAttrs
var attrs = Parser.parse('<gallery mode="slideshow" showthumbnails></gallery>')
	.querySelector('ext-attrs');
assert.equal(attrs, ' mode="slideshow" showthumbnails');
assert.deepStrictEqual(attrs.getAttrs(), {
	mode: 'slideshow',
	showthumbnails: true,
});

removeAttr

展开

param: string 属性键
移除指定属性。

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

toggleAttr

展开

param: string 属性键
开关指定属性。

// toggleAttr
var attrs = Parser.parse('<gallery mode="slideshow" showthumbnails></gallery>')
	.querySelector('ext-attrs');
assert.equal(attrs, ' mode="slideshow" showthumbnails');
attrs.toggleAttr('showthumbnails');
assert.equal(attrs, ' mode="slideshow" ');