跳到主要内容

标签

2023年08月10日
柏拉文
越努力，越幸运

一、标签名称​

1.1 /^<\/?([a-z][^\t\r\f\n\s/>]*)/i​

const startTagReg = /^<\/?([a-z][^\t\r\n\f\s/>]*)/i;

function parseTag(content) {
  const match = startTagReg.exec(content);
  const tag = match[1];
  return tag;
}

const str = '<div class="div-class"></div>';
console.log(parseTag(str));

const str1 = '<input class="div-class" />';
console.log(parseTag(str1));

二、标签内容​

2.1 /(?<=¥).*?(?=¥)/​

// 使用正则
let reg = /(?<=¥).*?(?=¥)/; 
let str = '¥1234¥';
// 使用
str.match(reg); // 输出 ['1234']

三、标签属性​

3.1 标签属性名​

const attributeNameReg = /^[^\t\r\n\f\s/>][^\t\r\n\f\s/>=]*/;

function parseAttributeName(content) {
  const match = attributeNameReg.exec(content);
  return match[0];
}

console.log(parseAttributeName('class="div-class"'));

3.2 标签属性值​

3.3 过滤标签属性值​

需求描述: 现有字符串str,str中有三个script标签。现在需要将src地址为vue.min.js的过滤掉

const str='<script src="http://localhost:8090/vue.min.js"></script><script src="http://localhost:8090/axios.min.js"></script><script src="http://localhost:8090/element-ui.min.js"></script>';
const reg=/<script(?:(?!<\/script>).)*axios(?:(?!<\/script>).)*<\/script>/g;
console.log(str.replace(reg,''));

四、结束标签​

4.1 /[\t\r\n\f\s/>]/​

需求描述: 判断是否为 xx 的结束标签

const endTagEndCharReg = /[\t\r\n\f\s/>]/;

function startsWith(source, searchString) {
  return source.startsWith(searchString);
}

function startsWithEndTagOpen(source, tag) {
  return (
    startsWith(source, '</') &&
    source.slice(2, 2 + tag.length).toLowerCase() === tag.toLowerCase() &&
    endTagEndCharReg.test(source[2 + tag.length] || '>')
  );
}

console.log('示例一', startsWithEndTagOpen('</div >', 'div'));