JS循环-如何知道循环的所有其他条件是否都满足

时间:2018-08-10 22:16:45

标签: javascript loops

注释在代码中(我根本不知道如何检查所有项目是否满足循环条件,如果是,请执行操作):

//编辑-更真实的示例。

因为工作示例确实很复杂,所以让我们假设...测试页面链接(或页面上的任何html元素)。

HTML:

    <html>
    <head>
    <title>Links test</title>
    </head>
    <body>
<!-- links are random - we do not know how many they are, and how many of them got title attribute -->
        <a href="https://www.google.com" title="google">google</a>
        <a href="https://facebook.com/">facebook<</a>
        <a href="https://www.instagram.com/" title="instagram">instagram</a>
        <a href="https://www.amazon.com/">amazon</a>
        <a href="https://www.apple.com/" title="apple">apple</a>
    </body>
    </html>

JS:

    let links = document.getElementsByTagName('a');
    let linksLength = links.length;
    let titleCount = 0;

    for (i = 0; i < linksLength; i++) {
        if (links[i].getAttribute('title') !== undefined) {
// I need to count all loop part that fulfil the condition
            titleCount += 1;
            // and if it's the last item that fulfil this condition then do something (in this main loop)
        }
    }

2 个答案:

答案 0 :(得分:0)

我建议使用filter方法,然后使用结果获取计数和最后一个元素。

给出一个数字数组data,下面是一个示例:

relevantData = data.filter(e => [4,5,6].includes(e));
count = relevantData.length;
lastItem = relevantData.slice(-1)

答案 1 :(得分:0)

                        let links = document.getElementsByTagName('a');
                        console.log('======================');
                        console.log('links HTML collection:\n');
                        console.log(links);
                        console.log('======================');
                        let linksLength = links.length;
                        let linksTitleCount = 0;
                        let html = '';

                        let linksArray = Array.from(links); // converting HTML collection to an array

                        let allLinksThatDoesHaveTitleAttr = linksArray.filter(function(l) 
                        {
                            return (l.getAttribute('title') !== undefined && l.getAttribute('title') !== null && l.getAttribute('title') !== '');
                        });
                        let allLinksThatDoesHaveTitleAttrCount = allLinksThatDoesHaveTitleAttr.length;
                        console.log();
                        console.log('======================');
                        console.log('allLinksThatDoesHaveTitleAttribute:\n');
                        console.log(allLinksThatDoesHaveTitleAttrCount);
                        console.log('======================');
                        //let lastItem = relevantData.slice(-1)


                        for (i = 0; i < linksLength; i++) { // main loop throught ALL links
                            // lets supose we... build html element
                            html += 'link' + [i] +'\n';

                            if (links[i].getAttribute('title') !== undefined && links[i].getAttribute('title') !== null && links[i].getAttribute('title') !== '') { // condition that check existance of title attribute - thanks @m_hutley
                                linksTitleCount += 1; // this is cause I need to count all loop part that fulfil the condition
                                console.log(linksTitleCount);
                                console.log();

                                html += 'this link - ' + [i] + ' - does not have title attribute! \n\n';

                                if (linksTitleCount == allLinksThatDoesHaveTitleAttrCount)
                                {
                                    console.log('DONE!'); // we know we are done - we loop throught all elements that does have title attr
                                    // NOW if it's the last item that fulfil this condition then do something (in this main loop) + some async operations that will leater (when data arrive) target specific HTML with specific link (order like in loop - [i])
                                }
                            }
                        }

                        console.log('HTML result is:\n');
                        console.log(html);