从嵌套元素中获取链接

时间:2019-02-14 17:01:07

标签: javascript jquery arrays

我看过类似的问题:jQuery retrieve elements from nested classes,但仍在挣扎。

这是我的代码:

var Array = [];
$('li').each(function () {
    if ($(this).has('a.online').length !== 0) {
        Array.push($('a.online').attr("href"));
    }
    else {
        Array.push("N/A");
    }
});

我试图遍历每个<li>元素,以检查它是否具有嵌套的<a>且类为“ online”。如果不是,我想推送到数组“ N / A”,如果是,则将链接推送到数组。当前,它正确地推送了N / A,但是链接却被incorecctt推送了。第一个链接将与<li>一起推送到所有<a class="online">。即,而不是拥有 “不适用,不适用,链接1,链接2,链接3” 我有“不适用,不适用,链接1,链接1,链接1” 任何帮助或指导,将不胜感激。 Link to html list

2 个答案:

答案 0 :(得分:1)

我认为问题出在这里

 Array.push($('a.online').attr("href"));

将其更改为

Array.push($(this).find('a.online').attr("href"));

答案 1 :(得分:0)

有很多方法可以实现您的结果:

var arr = new Array($('li').length).fill('"N/A"');
$('li a.online').each(function (idx, ele) {
    var idx = $(this).closest('li').index();
    arr[idx] = this.href;
});

或:

var arr1 = $('li').map(function() {
    if ($(this).has('a.online').length !== 0) {
        return $('a.online').attr("href");
    } else {
        return "N/A";
    }
}).get();

var arr = new Array($('li').length).fill('"N/A"');
$('li a.online').each(function (idx, ele) {
    var idx = $(this).closest('li').index();
    arr[idx] = this.href;
});

console.log(arr);

var arr1 = $('li').map(function() {
    if ($(this).has('a.online').length !== 0) {
        return $('a.online').attr("href");
    } else {
        return "N/A";
    }
}).get();

console.log(arr1);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<ul class="list">
    <li>
        <a class="link" href="https://ece.fiu.edu/academics/undergraduate/index.html" target="_blank">
            <p class="program">Computer Engineering (BS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Undergraduate</span><br/><a
                aria-label="Computer Engineering (BS) Online" class="online"
                href="http://fiuonline.fiu.edu/programs/online-undergraduate-degrees/bachelor-of-science-in-computer-engineering.php"
                target="_blank"><span class="hide format">Online</span>Available Online
            <br/></a><strong>College: </strong><a class="college-link" href="https://cec.fiu.edu/" target="_blank"><span
                class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Technology</span>
    </li>
    <li>
        <a class="link" href="https://www.cis.fiu.edu/academics/degrees/graduate/master-of-science-in-computer-science/"
           target="_blank">
            <p class="program">Computer Science (MS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://cec.fiu.edu/" target="_blank"><span class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Technology</span>
    </li>
    <li>
        <a class="link" href="https://www.cis.fiu.edu/academics/programs/grad/phdcs-summer-2013/" target="_blank">
            <p class="program">Computer Science (PhD)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://cec.fiu.edu/" target="_blank"><span class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Technology</span>
    </li>
    <li>
        <a class="link" href="https://schoolofconstruction.fiu.edu/academics/undergraduate/" target="_blank">
            <p class="program">Construction Management (BS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Undergraduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://cec.fiu.edu/" target="_blank"><span class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Sciences and Engineering</span>
    </li>
    <li>
        <a class="link" href="https://schoolofconstruction.fiu.edu/academics/graduate/" target="_blank">
            <p class="program">Construction Management (MS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><a
                aria-label="Construction Management (MS) Online" class="online"
                href="http://fiuonline.fiu.edu/programs/online-graduate-degrees/master-of-construction-management.php"
                target="_blank"><span class="hide format">Online</span>Available Online
            <br/></a><strong>College: </strong><a class="college-link" href="https://cec.fiu.edu/" target="_blank"><span
                class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Sciences and Engineering</span>
    </li>
    <li>
        <a class="link" href="https://crsp.fiu.edu/academics/degrees-and-programs/MS-Counselor-Edu/index.html"
           target="_blank">
            <p class="program">Counselor Education (MS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://case.fiu.edu/" target="_blank"><span class="college">Arts, Sciences &amp; Education</span></a>
        </p>
        <span class="area-of-interest hide">Education</span>
    </li>
    <li>
        <a class="link" href="https://english.fiu.edu/creative-writing/" target="_blank">
            <p class="program">Creative Writing (MFA)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://case.fiu.edu/" target="_blank"><span class="college">Arts, Sciences &amp; Education</span></a>
        </p>
        <span class="area-of-interest hide">Humanities and Culture</span>
    </li>
    <li>
        <a class="link" href="http://economics.fiu.edu/graduate/ma-in-economics/" target="_blank">
            <p class="program">Economics (MA)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://sipa.fiu.edu/" target="_blank"><span class="college">Steven J. Green School of International and Public Affairs</span></a>
        </p>
        <span class="area-of-interest hide">Business and Economics</span>
    </li>
    <li>
        <a class="link" href="http://economics.fiu.edu/graduate/phd-in-economics/" target="_blank">
            <p class="program">Economics (PhD)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://sipa.fiu.edu/" target="_blank"><span class="college">Steven J. Green School of International and Public Affairs</span></a>
        </p>
        <span class="area-of-interest hide">Business and Economics</span>
    </li>
    <li>
        <a class="link" href="http://education.fiu.edu/specialist_degrees.html?expanddiv=eds2" target="_blank">
            <p class="program">Educational Leadership (EdS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://case.fiu.edu/" target="_blank"><span class="college">Arts, Sciences &amp; Education</span></a>
        </p>
        <span class="area-of-interest hide">Education</span>
    </li>
    <li>
        <a class="link" href="http://education.fiu.edu/masters_degrees.html?expanddiv=ms14,ms44" target="_blank">
            <p class="program">Educational Leadership (MS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://case.fiu.edu/" target="_blank"><span class="college">Arts, Sciences &amp; Education</span></a>
        </p>
        <span class="area-of-interest hide">Education</span>
    </li>
    <li>
        <a class="link"
           href="https://lps.fiu.edu/academics/degrees-and-programs/edd-educational-leadership-policy-studies/index.html"
           target="_blank">
            <p class="program">Educational Leadership and Policy Studies (EdD)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://case.fiu.edu/" target="_blank"><span class="college">Arts, Sciences &amp; Education</span></a>
        </p>
        <span class="area-of-interest hide">Education</span>
    </li>
    <li>
        <a class="link" href="https://ece.fiu.edu/academics/graduate/phd-electrical-computer-engineering/index.html"
           target="_blank">
            <p class="program">Electrical and Computer Engineering (PhD)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://cec.fiu.edu/" target="_blank"><span class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Sciences and Engineering Technology</span>
    </li>
    <li>
        <a class="link" href="https://ece.fiu.edu/academics/undergraduate/index.html" target="_blank">
            <p class="program">Electrical Engineering (BS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Undergraduate</span><br/><a
                aria-label="Electrical Engineering (BS) Online" class="online"
                href="http://fiuonline.fiu.edu/programs/online-undergraduate-degrees/bachelor-of-science-in-electrical-engineering.php"
                target="_blank"><span class="hide format">Online</span>Available Online
            <br/></a><strong>College: </strong><a class="college-link" href="https://cec.fiu.edu/" target="_blank"><span
                class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Sciences and Engineering</span>
    </li>
    <li>
        <a class="link" href="https://ece.fiu.edu/academics/graduate/master-engineering/index.html" target="_blank">
            <p class="program">Electrical Engineering (MS)</p>
        </a>

        <p><strong>Degree type: </strong><span class="degree-type">Graduate</span><br/><strong>College: </strong><a
                class="college-link" href="https://cec.fiu.edu/" target="_blank"><span class="college">Engineering &amp; Computing</span></a>
        </p>
        <span class="area-of-interest hide">Sciences and Engineering Technology</span>
    </li>
</ul>