HtmlToken

• 简介
• Properties
  • name
  • closing
  • selfClosing
• Methods
  • lint
  • findMatchingTag
  • cloneNode
  • replaceTag
  • fix

Other Languages

• English

简介

HTML标签，未进行匹配。这个类同时混合了 AttributesToken 类的方法。

✅ 在 Mini 和 Browser 版本中可用。

Properties

name

✅ 展开

type: string
小写的标签名。

// name
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
assert.strictEqual(firstChild.name, 'b');

closing

✅ 展开

type: boolean
是否是闭合标签。

// closing
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
assert(!firstChild.closing);
firstChild.closing = true;
assert(firstChild, '</b>');

selfClosing

展开

type: boolean
是否自封闭。

// selfClosing
var {firstChild} = Parser.parse('<br/>');
assert.equal(firstChild, '<br/>');
assert(firstChild.selfClosing);
firstChild.selfClosing = false;
assert.equal(firstChild, '<br>');

Methods

lint

✅ 展开

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

// lint
var {childNodes: [h1, br, i, b]} = Parser.parse(`<h1/></br/><i></b>`);
assert.equal(h1, '<h1/>');
assert.equal(br, '</br/>');
assert.equal(i, '<i>');
assert.equal(b, '</b>');
assert.deepStrictEqual(h1.lint(), [
    {
        severity: 'error',
        message: '<h1>',
        startLine: 0,
        startCol: 0,
        startIndex: 0,
        endLine: 0,
        endCol: 5,
        endIndex: 5,
        excerpt: '<h1/></br/><i></b>',
    },
    {
        severity: 'error',
        message: 'invalid self-closing tag',
        startLine: 0,
        startCol: 0,
        startIndex: 0,
        endLine: 0,
        endCol: 5,
        endIndex: 5,
        excerpt: '<h1/>',
    },
]);
assert.deepStrictEqual(br.lint(), [
    {
        severity: 'error',
        message: 'tag that is both closing and self-closing',
        startLine: 0,
        startCol: 5,
        startIndex: 5,
        endLine: 0,
        endCol: 11,
        endIndex: 11,
        excerpt: '</br/>',
    },
]);
assert.deepStrictEqual(i.lint(), [
    {
        severity: 'warning',
        message: 'unclosed tag',
        startLine: 0,
        startCol: 11,
        startIndex: 11,
        endLine: 0,
        endCol: 14,
        endIndex: 14,
        excerpt: '<i></b>',
    },
]);
assert.deepStrictEqual(b.lint(), [
    {
        severity: 'error',
        message: 'unmatched closing tag',
        startLine: 0,
        startCol: 14,
        startIndex: 14,
        endLine: 0,
        endCol: 18,
        endIndex: 18,
        excerpt: '<h1/></br/><i></b>',
    },
]);

findMatchingTag

✅ 展开

returns: this
搜索匹配的标签。

// findMatchingTag
var {firstChild, lastChild} = Parser.parse('<p></p>');
assert.equal(firstChild, '<p>');
assert.equal(lastChild, '</p>');
assert.strictEqual(firstChild.findMatchingTag(), lastChild);
assert.strictEqual(lastChild.findMatchingTag(), firstChild);

cloneNode

展开

returns: this
深拷贝节点。

// cloneNode
var {firstChild} = Parser.parse('<p>');
assert.equal(firstChild, '<p>');
assert.deepStrictEqual(firstChild.cloneNode(), firstChild);

replaceTag

展开

param: string 标签名
更换标签名。

// replaceTag
var {firstChild} = Parser.parse('<b>');
assert.equal(firstChild, '<b>');
firstChild.replaceTag('i');
assert.equal(firstChild, '<i>');

fix

展开

修复无效自封闭标签。

// fix
var {lastChild} = Parser.parse('<b><b/>');
assert.equal(lastChild, '<b/>');
lastChild.fix();
assert.equal(lastChild, '</b>');