如何使用没有任何ID的Javascript替换列(在表内)中的文本

时间:2010-12-02 23:06:22

标签: javascript html replace

下面的代码显示了呈现的HTML(来自Compiled ASP .Net代码)。我无法对其进行任何更改,包括添加ID等新属性。

我仍然可以使用Javascript做一些事情,但由于该列没有唯一ID,我无法替换下划线文字“ _ __ _ __ _ __ _ __ “以及其他一些文字。

计划是用第3列替换每行的下划线和其他文本。有没有办法用Javascript识别第3列?

谢谢。

    <table width='100%'>
        <tr>
            <td align="left" valign="top" class='clsReadOnly'>Row 1
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                abc
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                __________________________
            </td>
        </tr>
        <tr>
            <td align="left" valign="top" class='clsReadOnly'>Row 2
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                def
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                __________________________
            </td>
        </tr>
        <tr>
            <td align="left" valign="top" class='clsReadOnly'>Row 3
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                ghi
            </td>
            <td align="left" valign="top" class='clsReadOnly'>
                __________________________
            </td>
        </tr>
    </table>

3 个答案:

答案 0 :(得分:2)

如果这是页面上唯一的表,你可以使用jQuery:

$('table')
    .children('tr')
    .each(function() {
        $(this).children('td:last').html('<p>A Paragraph of Text</p>');
    });

答案 1 :(得分:1)

这取决于你想要完成的任务。如果这是您的表总是看起来的样子,您可以执行以下操作:

var cells = document.getElementsByClassName('clsReadOnly');

cells[2].innerHTML = "Row1 Column3";
cells[5].innerHTML = "Row2 Column3";
cells[8].innerHTML = "Row3 Column3";

如果您不知道要开始的列数,则必须执行此操作:

var rows = document.getElementsByTagName('tr');

for (var i=0; i<rows.length; i++) {
    var cells = rows[i].getElementsByTagName('td');

    cells[2].innerHTML = 'Row'+(i+1)+' Column3';
}

jQuery会让这更容易,因为你可以通过标签,父母等来选择。当然,你可以用普通的JavaScript来完成所有这些,但它需要做更多的工作。

http://jsfiddle.net/bShZa/

答案 2 :(得分:1)

getElementsByClassName()是HTML5,IE目前不支持。这是解决方案http://jsfiddle.net/V38MF/2/没有jQuery所需的jsfiddle

var myTable = document.getElements('td');
for(var i=0; i<myTable.length; i++){
    if((i+1)%3 == 0)
        console.log(myTable[i].innerHTML);
}