-3

のIDを警告するJavaScript関数を作成するにはどうすればよい<td>ですか? 私は試した：

function test() {
  alert(document.documentElement.id); 
}

しかし、それはうまくいきませんでした。

基本的に、テーブルを使用してページ上にグリッドを作成しています。テーブルの各セルにマウスを合わせると、関数がセルの ID を教えてくれます。仕組みとその詳細はすでに知っていますonMouseOverが、機能を機能させることができないようです。

4

2 に答える 2

1

テーブルに単一のリスナーを配置できます。

<table onmouseover="showId(event);" ...>

次に、関数で、マウスオーバーがテーブルにバブルアップする TD 要素の ID を表示します。

function showId(evt) {
  var element = evt && (evt.target || evt.srcElement);

  if (element && element.tagName && element.tagName.toLowerCase() == 'td') {
    console.log(element.id);
  }
}

リスナーを動的にアタッチすることはできますが、古いブラウザーの場合はブラウザーのちょっとした癖に対処する必要がある場合があります。たとえば、以下は使用中のどのブラウザーでも機能します (テーブルにはリスナーをアタッチするための ID がありますが、ID を必要としない方法は他にもあります)。

<table id="t0">
  ...


window.onload = function() {
  var table = document.getElementById('t0');
  table.onmouseover = showId;
}

function showId(evt) {
  evt = evt || window.event;
  var element = evt && (evt.target || evt.srcElement);

  if (element && element.tagName && element.tagName.toLowerCase() == 'td') {
    alert(element.id);
  }
}
于 2013-10-03T23:45:12.877 に答える