关于数组去重

最近的一道面试题：得到 class id tagName

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <div id="page">
        <div class="content main">
            <div class="refer">
                <ul>
                    <li></li>
                    <li></li>
                </ul>
             </div>
        </div>
    </div>
</body>
</html>
<script>
  /* 根据上述HTML结构，完善如下JavaScript代码中的“your code here”部分，使得click事件中的注释要求符合预期：
*/
    var genCssSelector = function(){
        //your code here
    }

    document.addEventListener('click', function(e){

    //点击li时，返回：html body #page .content.main .refer ul li

    console.log(genCssSelector(e.target));

}) 
</script>

方法一用对象加属性方法避免数组元素重复

var genCssSelector = function(){
    //your code here

    var len = arguments.length,
        str = {},
        a = arguments;

    for (var i = 0; i < len; i++) {

        if(a[i].tagName.toLowerCase() == 'head' || 
           a[i].tagName.toLowerCase() == 'script' ||
           a[i].tagName.toLowerCase() == 'style') {
            continue;
        }

        if(a[i].className) {
            var arr = a[i].className.split(' ');
            arr.forEach(function(data) {
                str['.' + data] = 0;
            });
        } else if(a[i].id){
            str['#' + a[i].id] = 0;
        } else {
            str[a[i].tagName.toLowerCase()] = 0;
        }
        if(a[i].children.length !== 0){
            str[genCssSelector.apply(null, a[i].children)] = 0;
        }
    }
    return Object.keys(str).join(' ');
}

方法二同样的思想用 indexOf()判断

var genCssSelector = function(){
    //your code here

    var len = arguments.length,
        str = [],
        a = arguments;

    for (var i = 0; i < len; i++) {

        if(a[i].tagName.toLowerCase() == 'head' || 
           a[i].tagName.toLowerCase() == 'script' ||
           a[i].tagName.toLowerCase() == 'style') {
            continue;
        }

        if(a[i].className) {
            var arr = a[i].className.split(' ');
            arr.forEach(function(data) {
                if (str.indexOf('.' + data) === -1) {
                    str.push('.' + data);
                }
            });
        } else if(a[i].id){
            if (str.indexOf('#' + a[i].id) === -1) {
                str.push('#' + a[i].id);
            }
        } else {
            if (str.indexOf(a[i].tagName.toLowerCase()) === -1) {
                str.push(a[i].tagName.toLowerCase());
            }
        }
        if(a[i].children.length !== 0){
            str.push(genCssSelector.apply(null, a[i].children));
        }
    }
    return str.join(' ');
}

方法一 用对象加属性方法避免数组元素重复

方法二 同样的思想 用 indexOf()判断

猜你喜欢

方法一用对象加属性方法避免数组元素重复

方法二同样的思想用 indexOf()判断