Question

I am trying to find all table cells containing “FieldName=”. I did this initially with getElementsByTagName and then looped through testing with indexOf and it works just fine, getting 191 cells and then successfully testing for my target cells perfectly.

I then tried it with $(“td:contains(‘FieldName’)”); and it fails. I’ve tried backslashing the equals sign, double backslashing it and even removing it and I still get zero hits. The case is correct as it works with indexOf without need for converting to UC or LC.

Help! 🙂 Seriously, standard JS works so I’ll get by, but it’s really frustrating to not be able to use such a cool tool and not know why. Here’s my code – comment and uncomment to see the result of both approaches:

//var cells = document.getElementsByTagName("td");
var cells = $("td:contains('FieldName\=')");
alert(cells.length);
for (var i = 0; i < cells.length; i++) {
    if (cells[i].innerHTML.indexOf('FieldName=') > -1) {
        // do stuff here...
    }
}

I’m sure I’ll feel silly when someone spots my mistake, but that’s how we learn, eh? 🙂

A sample cell:

        <TD valign="top" class="ms-formbody" width="400px">
    <!-- FieldName="Title"
         FieldInternalName="Title"
         FieldType="SPFieldText"
      -->
        <span dir="none">
    <input name="ctl00$m$g_c2ed1f85_8eef_4759_817c_cd68435bd0a3$ctl00$ctl04$ctl00$ctl00$ctl00$ctl04$ctl00$ctl00$TextField" type="text" maxlength="255" id="ctl00_m_g_c2ed1f85_8eef_4759_817c_cd68435bd0a3_ctl00_ctl04_ctl00_ctl00_ctl00_ctl04_ctl00_ctl00_TextField" title="Title" class="ms-long" /><br>
</span>


    </TD>

Answer 1

The problem I see here is the difference between this line:

cells[i].innerHTML

and the way :contains works. :contains searches for a text string. It will ignore your HTML comments.

The reason innerHTML is working is because it returns everything as a String, :contains will only return a string found within the innerText of this element and child elements.

You could still use jquery in conjunction with plain JS to accomplish your goal like so:

$("td").each(function () {
    // var this is the current element's DOM object
    if (this.innerHTML.indexOf("FieldName") != -1) {
        // do stuff
    }
});