美文网首页
HTML标签的相关操作判断

HTML标签的相关操作判断

作者: 欢欣的膜笛 | 来源:发表于2021-05-13 16:44 被阅读0次

统计HTML标签中以b开头的标签数量

// 实现方式一:
const tags = document.getElementsByTagName('*')
// 要使用数组的方法必须将类数组转为真正的数组
const value = [...tags].filter(item => item.tagName.startsWith('B'))


// 实现方式二:
const $prefixBElements = []
function getElementNum($el) {
    if ($el.tagName.startsWith('B')) {
        $prefixBElements.push($el)
    }
    for (const $child of $el.children) {
        getElementNum($child)
    }
}
getElementNum(document.documentElement);

统计HTML标签中出现次数最多的标签

const tags = document.getElementsByTagName('*');
let map = new Map();
let maxStr = '';
let max = 0;
// 只是使用下标来获取,没有使用数组的方法,所以不需要将类数组转为数组
for(let i = 0; i < tags.length; i++) {
    let value = map.get(tags[i].tagName)
    if(value) {
        map.set(tags[i].tagName, ++value)
    } else {
        map.set(tags[i].tagName, 1);
    }
    if(value > max) {
        maxStr = tags[i].tagName;
        max = value;
    }
}
console.log(`当前最多的标签为 ${maxStr},个数为 ${max}` );

判断DOM标签的合法性

如标签的闭合、span里面不能有div、其他符合HTML标签合法性的规则等
参考

相关文章

  • HTML标签的相关操作判断

    统计HTML标签中以b开头的标签数量 统计HTML标签中出现次数最多的标签 判断DOM标签的合法性 如标签的闭合、...

  • html a标签相关

    1

  • web前端案例-开发饿了么LBS移动地图点餐系统

    知识点::html/css,标签运用、样式讲解、静态开发布局、行业标准。JS基础、if判断、jq方法 Dom操作、...

  • web前端基础小案例:制作百度换肤效果

    知识点:html加css,标签运用、样式讲解、静态开发布局、行业标准。JS基础、if判断、jq方法 Dom操作、逻...

  • Day12:H5

    掌握HTML+CSS+JavaScript相关知识 了解HTML5的结构标签;掌握新增和删去的标签及相关属性运用H...

  • 关于HTML

    (一)PS操作: (二)HTML(及标签):1:HTML的文档构成: 2:HTML:具有严谨型和过渡型 3:标签:...

  • 全部 html + 相关 css 汇总

    以下是常用html+相关css全部汇总: # 01html标签 ``` html标签 是组成网页的骨架 区域划分作...

  • 八、H5中对音视频的设计

    html5标签 video标签的属性 audio标签的属性 音视频js相关属性 音视频js相关函数 js相关事件

  • HTML中的相关标签

    一谈起html中的标签大家第一反应都是div,其实还有许许多多的语义标签。下面一一介绍: 1. , , .....

  • Html常用标签介绍

    在前端开发工作中,常用的html标签有: 1.文档元数据标签 标签:表示那些不能由其它Html院相关标签( , ,...

网友评论

      本文标题:HTML标签的相关操作判断

      本文链接:https://www.haomeiwen.com/subject/goxxjltx.html