2020搜狗前端面试题（编程题）：完成一个 getTags 函数，可以检测当前页面用到了哪些标签..._完成一个gettags函数可以检测页面遇到了哪些标签函数返回包含标签的字符串数组-优快云博客

本文链接：https://blog.youkuaiyun.com/nmsl_double/article/details/108776920

本文记录了一道搜狗2020年前端面试编程题，要求编写一个getTags函数，该函数能检测当前页面使用的HTML标签并返回小写的标签名数组。文章提供了两种解题思路，但未完全实现ES5的去重功能。示例代码展示了如何遍历DOM获取标签，并通过递归处理子元素。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

记录第二个面试题（编程题）–搜狗2020前端面试题

题目：完成一个 getTags 函数，可以检测当前页面用到了哪些标签，函数返回包含标签的字符串的数组，比如页面如下
复制代码

在页面中运行 getTags() 之后，函数就返回数组 [‘html’, ‘head’ ‘body’, ‘div’, ‘p’] (顺序不重要)。
注意：
1、标签名称使用小写
2、请使用ES5语法
3、答题时不要使用第三方插件
解答：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>sougou</title>
    <style>
        li {
            list-style: none;
        }
    </style>
</head>

<body>
    <div>
        <ul id="test">
            <li> <a href="javascript:;">wohsi</a> </li>
            <li><span>你好</span></li>
            <li>
                <table>
                    <tbody>
                        <tr>
                            <td>
                                就这
                            </td>
                            <td>
                                就这
                            </td>
                        </tr>
                        <tr>
                            <td>
                                就这
                            </td>
                        </tr>
                        <tr>
                            <td>
                                就这
                            </td>
                        </tr>
                    </tbody>
                </table>
            </li>
        </ul>
    </div>
    <script>
        //获取html
        var arr = [];
        var fhtml = document.documentElement;
        arr.push(fhtml.tagName);
        getChild(fhtml);
        arr = arr.join(',').toLowerCase().split(',');
        console.log(arr);
        //获取子元素
        function getChild(e) {
            var childs = e.children;
            // console.log(childs);
            for (const key in childs) {
                if (childs.hasOwnProperty(key)) {
                    const element = childs[key];
                    arr.push(element.tagName);
                    getChild(element);
                    // console.log(element);
                }
            }
            //es6新增数组去重方法
            arr = [...new Set(arr)]
        }
        //第二种方法，未添加去重方法
        var arr2 = [];
        (function getTags() {
            var list1 = document.getElementsByTagName('*');
            // console.log(list1)
            for (const key in list1) {
                if (list1.hasOwnProperty(key)) {
                    const element = list1[key];
                    arr2.push(element.tagName);
                }
            }
            arr2 = arr2.join(',').toLowerCase().split(',');
            console.log(arr2);
        })()
    </script>
</body>

</html>