Нахождение ячейки в таблице

157
22 июля 2018, 22:20

как можно найти ячейку в таблице задав x и y

Answer 1

Если самый простой способ, то как-то так.

let table = document.getElementById('my-table'); 
 
let findingInTable = function(row, cell) { 
  return table.getElementsByTagName('tr')[row].getElementsByTagName('td')[cell].innerHTML; 
} 
 
let findingInTableES6 = (row, cell) => table.getElementsByTagName('tr')[row].getElementsByTagName('td')[cell].innerHTML; 
 
console.log(findingInTable(2, 1)); 
console.log(findingInTableES6(1, 2)); 
 
 
let findingInTableJQ = (row, cell) => $('table#my-table tr:nth-child(' + row + ') td:nth-child(' + cell + ')').html(); 
 
console.log(findingInTableJQ(1, 2));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<table id="my-table"> 
  <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
  </tr> 
  <tr> 
    <td>4</td> 
    <td>5</td> 
    <td>6</td> 
  </tr> 
  <tr> 
    <td>7</td> 
    <td>8</td> 
    <td>9</td> 
  </tr> 
</table>

Answer 2

На JQuery

function getCell(x,y){ 
  var cell = $('table').find('tr').eq(y-1).children('td').eq(x-1); 
  return cell; 
} 
$('button').click(function(){ 
  $('td').removeClass('active'); 
  var x = +$('[name=column]').val(); 
  var y = +$('[name=row]').val(); 
  getCell(x,y).addClass('active'); 
})
table{ 
  border-collapse:collapse; 
} 
td{ 
  padding:3px; 
  border:1px solid; 
  transition:all .2s ease; 
} 
td.active{ 
  background-color:rgba(255,0,0,.3); 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<table> 
  <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
  </tr> 
  <tr> 
    <td>4</td> 
    <td>5</td> 
    <td>6</td> 
  </tr> 
  <tr> 
    <td>7</td> 
    <td>8</td> 
    <td>9</td> 
  </tr> 
</table>  
<input type="number" min="1" max="3" name="row" placeholder="Ряд" /> 
<input type="number" min="1" max="3" name="column" placeholder="Колонка" /> 
<button>Обозначить ячейку</button>

READ ALSO
Как сделать активный клик на javascript?

Как сделать активный клик на javascript?

У меня есть див, хочу сделать так, чтобы при нажатии на него появлялась полоска (hr), но выполнить это нужно так, чтобы полоска появлялась только...

236
Что именно отвечает за выделение текста?

Что именно отвечает за выделение текста?

Мне нужно, чтобы по клику текст копировался, но не выделялсяНе могу понять какой метод отвечает за выделение

191
Как не дать добавить значение?

Как не дать добавить значение?

У меня есть БД, в ней есть таблица запись, в самой таблице, есть колонка "Время" Как мне сделать, чтобы нельзя было добавить одитнаковое времяЯ...

187