2

とにかく、JavaSCriptを使用して<table>で指定されたn番目の<td>のinnerHTMLを取得できますか？

テーブルは自動的に生成されるため、<td>にはIDがありません。次のHTMLコードを使用しています。

<table id="table">
  <tr>
    <td onmouseover="myTD()">Cell 1</td>
    <td onmouseover="myTD()">Cell 2</td>
    <td onmouseover="myTD()">Cell 3</td
  </tr>
  <tr>
    <td onmouseover="myTD()">Cell 4</td>
    <td onmouseover="myTD()">Cell 5</td>
    <td onmouseover="myTD()">Cell 6</td>
  </tr>
</table>

しかし、たとえばセル5にアクセスするにはどうすればよいでしょうか。

どうもありがとう！

var cells = document.getElementById('table').getElementsByTagName('td');

これには、すべてのテーブルセルが含まれます。配列表記を使用して、特定の表記にアクセスします。

cells[4]

これは、背景色を変更する簡単なデモです。

http://jsfiddle.net/jackwanders/W7RAu/

4

8 に答える 8

13 
var cells = document.getElementById('table').getElementsByTagName('td');

これには、すべてのテーブル セルが含まれます。配列表記を使用して特定の配列にアクセスします。

cells[4]

背景色を変更する簡単なデモを次に示します。

http://jsfiddle.net/jackwanders/W7RAu/

于 2012-07-06T16:04:52.567 に答える
2

何が必要かわからない-Dom：document.getElementsByTagName（ "table"）[0] .rows [2] .cells [1]

于 2012-07-06T16:05:41.833 に答える
2

セルを関数に戻します。

<td onmouseover="myTD(this)">Cell 1</td>

オブジェクトからinnerhtmlを取得します。

function myTD(obj) {
    alert(obj.innerHTML);
}
于 2012-12-02T23:52:52.283 に答える
1

この行：

$('td')

tdコード内のすべての要素をゼロベースの配列に配置するため、コンテンツとして「セル5」を含むセルは、その配列の5番目の要素になります。

$('td')[4]

jQueryはCSSスタイルセレクターも受け入れるため、行の1つおきのセルをターゲットにする場合は、次のようなセレクターを使用できます。

$('tr td:nth-child(2)')

私がリンクしたセレクターのドキュメントを読んでください。このような状況で非常に便利です。

于 2012-07-06T16:07:54.883 に答える
1

いつ（ロード時、ホバリング時、...）、どこ（クライアント側、サーバー側...）でそれを実行したいかを明確にできますか？

myTD内にセルが必要な場合は、次のキーワードを使用してください。これはたまたまHTMLTableCellです。

function myTD() {
   this.style.color="red"; // just for the example, using CSS classes is much better
}
于 2012-07-06T16:09:04.237 に答える
1

CSSだけを使用すると、次のことができます。

#table tr:nth-child(2) td:nth-child(2)
{
    background:#ff0000;
}​

jsFiddleの例

于 2012-07-06T16:05:58.037 に答える
1 
function addClassToNthTD(n) {
    var table = document.getElementById('table');

    for (var i = 0; i < table.childNodes.length; i++;) {
        var rows = table.childNodes[i];
        for (var j = 0; j < tr.childNodes.length; j++;) {
            n = n - 1;
            if (n == 0) {
                tr.childNodes[j].className = 'foo';
            }
        }
    }
}
于 2012-07-06T16:06:01.203 に答える
0

あなたが何をしようとしているのかわかりませんが、ある種の「ホバー」機能を実行したい場合、jqueryはそれを非常に簡単に実行できます。Fiddleの例を作成しましたhttp://jsfiddle.net/fd3GK/1/

于 2012-07-06T16:12:31.560 に答える