[js] 第213天 写一个方法检测页面中的所有标签是否正确闭合
Opened this issue · 5 comments
haizhilin2013 commented
第213天 写一个方法检测页面中的所有标签是否正确闭合
cxwht commented
这个类似力扣第20题:
`var isValid = function(s) {
let valid = true;
const stack = [];
const mapper = {
'{': "}",
"[": "]",
"(": ")"
}
for(let i in s) {
const v = s[i];
if (['(', '[', '{'].indexOf(v) > -1) {
stack.push(v);
} else {
const peak = stack.pop();
if (v !== mapper[peak]) {
return false;
}
}
}
if (stack.length > 0) return false;
return valid;
};`
里面的标签改一改,其实就差不多了
wheatup commented
可以使用template
对该HTML进行编译,然后对比两者是否一致,如果不一致表示有未闭合的标签/不符合规范的语法,被编译器自动修正了。
const areAllTagsClosed = html => {
const template = document.createElement('template');
template.innerHTML = html;
return template.innerHTML === html;
}
areAllTagsClosed(`<div><span></div>`); // false
areAllTagsClosed(`<div><br></div>`); // true
template
内的html编译后在未挂载dom前不会触发事件以及javascript,可以在其挂载dom之前对其进行消毒处理,该手段也是防XSS的主要方法之一。
Ryuurock commented
这道题就是考栈思维嘛,给一个数组,遇到起始标签入栈,遇到结束标签出栈,若最后无法得到一个空栈,说明有未闭合的标签,自闭合的除外
zeroone001 commented
(function () {
let dom_str = document.querySelector('body').outerHTML;
let stack = [];
for (let i in dom_str) {
const v = dom_str[i];
if (v === '<') {
stack.push(v);
} else if (v === '>') {
let peak = stack.pop();
if (peak !== '<') return false;
}
}
if (stack.length > 0) return false;
return true;
})();
xiaoqiangz commented
const peak = htmls => {
let stack = []
for(i in htmls) {
let s = htmls[i]
if (s === '<') {
stack.push(s)
} else if(s === '>') {
let lPeak = stack.pop()
if (lPeak !== '<') return false
}
}
if (stack.length > 0) return false
return true
}