Javascript 选择具有包含单词的属性的 anchor

Question

我试图仅选择表格中的一组特定链接。我认为最好的方法是通过包含所有包含单词“ULD”的标题属性来选择它们。

这是我的代码，它允许我将范围缩小到表中的所有链接，但不能再进一步了。我尝试了 querySelectorAll() 和 selectElementsbyTitle 但没有运气。另请记住，这需要在 IE11 中运行，并且不能在 JQuery 中运行。

var tabl = document.getElementById("Func15543_tblMissedBagReport");var anchors = tabl.getElementsByTagName("a");

以下是我要从下表中选择的链接:

<A
                        CLASS="ESR-Ajax"
                        TITLE="View ULD B1769SELAZ5 detail"
                        HREF="Javascript:void(0)"
                        AJAX-FUNCTION="Shared_ULDDetail"
                        intMasterReferenceNumber="5433550294352748012"
                        intULDReferenceNumber="-5893118207572745590"
                        strULDTypeCode="01"
                        dtmReportDate="2018-12-14"
                        intPageNumber="1">
                        B1769SELAZ5 
                        </A>

以下是表格示例:

丢失行李报告

<img src="../Content/images/icons/excel.gif" border="0" alt="Click to export to excel." title="Click to export to excel." height="13" width="13">

            </a>

        </SPAN>
        <SPAN CLASS="CaptionRight">
            <SPAN ID="Func15543_PagingControlOne"></SPAN>
        </SPAN>
    </CAPTION>
    <THEAD>
    <TR>
        <TH ROWSPAN="2">#</TH>
        <TH COLSPAN="5">Destination</TH>
        <TH ROWSPAN="2">Load<BR>Create<BR>Sort</TH>
        <TH ROWSPAN="2">Bag Close Time</TH>
        <TH ROWSPAN="2">Age > 90 min (Red)</TH>
        <TH ROWSPAN="2">Bag Tag #</TH>
        <TH ROWSPAN="2">Pkgs<BR>in<BR>Bag</TH>
    </TR>
    <TR>
        <TH>Cntry<BR>Code</TH>
        <TH>SLIC</TH>
        <TH>Sort</TH>
        <TH>Serv Lvl</TH>
        <TH>Location</TH>
    </TR>
    </THEAD>

    <TBODY>


        <TR>
            <TD CLASS="CenterText ">1</TD>
            <TD CLASS="CenterText ">US</TD>
            <TD CLASS="CenterText ">4009 </TD>
            <TD CLASS="CenterText ">D</TD>
            <TD CLASS="CenterText ">2DA</TD>
            <TD CLASS="CenterText ">GRADE LANE HUB                                    </TD>
            <TD CLASS="CenterText ">T</TD>
            <TD CLASS="CenterText ">
            12/14/18 4:12 PM
            </TD>

                <TD CLASS="WhiteText CenterText G_CLR_Green5 ">
                      56 Mins. Old
            </TD>
            <TD CLASS="CenterText ">
                <A
                CLASS="ESR-Ajax"
                TITLE="View ULD B1769SELAZ5 detail"
                HREF="Javascript:void(0)"
                AJAX-FUNCTION="Shared_ULDDetail"
                intMasterReferenceNumber="5433550294352748012"
                intULDReferenceNumber="-5893118207572745590"
                strULDTypeCode="01"
                dtmReportDate="2018-12-14"
                intPageNumber="1">
                B1769SELAZ5 
                </A>
            </TD>
            <TD class="CenterText ">       6</TD>
        </TR>



        <TR>
            <TD CLASS="CenterText G_CLR_6">2</TD>
            <TD CLASS="CenterText G_CLR_6">US</TD>
            <TD CLASS="CenterText G_CLR_6">0759 </TD>
            <TD CLASS="CenterText G_CLR_6">N</TD>
            <TD CLASS="CenterText G_CLR_6">GRD</TD>
            <TD CLASS="CenterText G_CLR_6">SADDLEBROOK                                       </TD>
            <TD CLASS="CenterText G_CLR_6">T</TD>
            <TD CLASS="CenterText G_CLR_6">
            12/14/18 4:15 PM
            </TD>

                <TD CLASS="WhiteText CenterText G_CLR_Green5">
                      53 Mins. Old
            </TD>
            <TD CLASS="CenterText G_CLR_6">
                <A
                CLASS="ESR-Ajax"
                TITLE="View ULD B1769SEL3I0 detail"
                HREF="Javascript:void(0)"
                AJAX-FUNCTION="Shared_ULDDetail"
                intMasterReferenceNumber="5433550294352748012"
                intULDReferenceNumber="8922482455613715109"
                strULDTypeCode="01"
                dtmReportDate="2018-12-14"
                intPageNumber="1">
                B1769SEL3I0 
                </A>
            </TD>
            <TD class="CenterText G_CLR_6">       6</TD>
        </TR>

Answer 1

您可以将 querySelectorAll 与 attribute selector 一起使用[attr] 和包含标志 *=:

var table = document.querySelector('table');
var links = table.querySelectorAll('a[title*="ULD"]');

console.log(links);

<table>
  <tr>
    <td><a href="" title="ab ULD cd">One</a></td>
    <td><a href="" title="abcd ULD">Two</a></td>
    <td><a href="" title="abcd">Three</a></td>
  </tr>
</table>