只要您处于浏览器上下文或使用类似的DOM API，白名单在JS中就非常简单。

此示例获取

的输出并生成文档片段。然后根据片段中的节点phrasing content(它们是marked个元素可能包含的唯一节点)对片段中的节点进行过滤。在过滤之后，然后返回结果节点，以便它们可以在DOM中使用。

const phrasingContent = [

'#text', 'a', 'abbr', 'area', 'audio', 'b', 'bdi', 'bdo', 'br', 'button',

'canvas', 'cite', 'code', 'data', 'datalist', 'del', 'dfn', 'em', 'embed',

'i', 'iframe', 'img', 'input', 'ins', 'kbd', 'keygen', 'label', 'map', 'mark',

'math', 'meter', 'noscript', 'object', 'output', 'picture', 'progress', 'q',

'ruby', 's', 'samp', 'script', 'select', 'small', 'span', 'strong', 'sub',

'sup', 'svg', 'template', 'textarea', 'time', 'u', 'var', 'video', 'wbr'

]

function sanitize(text) {

const t = document.createElement('template')

t.innerHTML = text

whitelist(t.content, phrasingContent)

return t.content

}

function whitelist(parent, names) {

for (const node of parent.childNodes) {

whitelist(node, names)

if (!names.includes(node.nodeName.toLowerCase())) {

unwrap(node)

}

}

}

function unwrap(node) {

const parent = node.parentNode

while (node.firstChild) {

parent.insertBefore(node.firstChild, node)

}

parent.removeChild(node)

}

function empty(node) {

while (node.firstChild) {

node.removeChild(node.firstChild)

}

}

const form = document.querySelector('form')

const input = document.querySelector('textarea')

const output = document.querySelector('output')

form.addEventListener('submit', e => {

e.preventDefault()

empty(output)

output.appendChild(sanitize(marked(input.value)))

}, false)

当然，所有这些都假设一个浏览器环境，并且可以在通过

*foo*

Test

text text

库处理输入后处理白名单。