Javascript-форум - Вопрос про вложенные заголовки таблицы

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Вопрос про вложенные заголовки таблицы (https://javascript.ru/forum/dom-window/57097-vopros-pro-vlozhennye-zagolovki-tablicy.html)

Вопрос про вложенные заголовки таблицы

Имеется таблица со вложенными заголовками. Выглядит примерно так.

Я поиском нахожу нужную мне ячейку заголовка. Допустим это H11, как мне найти и обратиться к заголовку H1? Количество ячеек я заранее не знаю, то есть каждый раз мне "прилетает" разная таблица, но такого вот формата.

пример заголовка:

<thead bgColor="white">
				<TR>
					<th  colspan = 1 ROWSPAN=2 class="id1" style="display: table-cell;">Имя</th>
					<th  colspan = 1 ROWSPAN=2 class="id2" style="display: table-cell;">Фамилия</th>	
					<th COLSPAN=3  class="id3" class="id3" style="display: table-cell;">Коэффициенты</th>					
					<th  colspan = 1 ROWSPAN=2 class="id4" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id5" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id6" style="display: table-cell;">Время прибытия</th>
					<th COLSPAN=4  class="id7" class="id7" style="display: table-cell;">Коэффициенты 2</th>
					<th  colspan = 1 ROWSPAN=2 class="id8" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id9" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id10" style="display: table-cell;">Время прибытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id11" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id12" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id13" style="display: table-cell;">Время прибытия</th>					
				</TR>
				<TR>
					<th   name="id14" class="id3" style="display: table-cell;"><div class="vertical">К1</div></th>
					<th   name="id15" class="id3" style="display: table-cell;"><div class="vertical">К2</div></th>
					<th   name="id16" class="id3" style="display: table-cell;"><div class="vertical">К3</div></th>
					<th   name="id17" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС1</div></th>
					<th   name="id18" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС2</div></th>
					<th   name="id19" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС3</div></th>
					<th   name="id20" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС4</div></th>
				</TR>
			</thead>

Arukueido,
зачем плодить темы http://javascript.ru/forum/dom-windo...tml#post378674

Цитата:

Сообщение от Arukueido

как мне найти и обратиться к заголовку H1?

строка 50 добавить нужный вам код для $th и el

Этот код мне сейчас не подходит, т.к. у меня просто огромные таблицы и все виснет. Поэтому задала вопрос отдельно, он не особо связан с предыдущей темой.

Arukueido,
код взят из предыдущего сообщения, ничем более помочь не могу ... кликать по K1...K2...МОЭВС4

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
 table, th{
   border: 1px solid Black;
 }

  </style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(function() {
    var $thfirst = $("thead tr:first th");
        $thlast = $("thead tr:last th"),
        $two = 0;
    $thfirst.each(function(indx, el) {
        var $c = this.colSpan,
            $r = this.rowSpan,
            $text = $(el).text(),
            $th;
        $r == 1 && ($th = $thlast.slice($two, $two + $c), $two += $c, $th.each(function() {
            $(this).click(function() {
                alert($text)
            })
        }));
    })
});  </script>

</head>

<body>
<table width="400" summary="" >
	<thead bgColor="white">
				<TR>
					<th  colspan = 1 ROWSPAN=2 class="id1" style="display: table-cell;">Имя</th>
					<th  colspan = 1 ROWSPAN=2 class="id2" style="display: table-cell;">Фамилия</th>
					<th COLSPAN=3  class="id3" class="id3" style="display: table-cell;">Коэффициенты</th>
					<th  colspan = 1 ROWSPAN=2 class="id4" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id5" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id6" style="display: table-cell;">Время прибытия</th>
					<th COLSPAN=4  class="id7" class="id7" style="display: table-cell;">Коэффициенты 2</th>
					<th  colspan = 1 ROWSPAN=2 class="id8" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id9" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id10" style="display: table-cell;">Время прибытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id11" style="display: table-cell;">Время регистрации</th>
					<th  colspan = 1 ROWSPAN=2 class="id12" style="display: table-cell;">Время отбытия</th>
					<th  colspan = 1 ROWSPAN=2 class="id13" style="display: table-cell;">Время прибытия</th>
				</TR>
				<TR>
					<th   name="id14" class="id3" style="display: table-cell;"><div class="vertical">К1</div></th>
					<th   name="id15" class="id3" style="display: table-cell;"><div class="vertical">К2</div></th>
					<th   name="id16" class="id3" style="display: table-cell;"><div class="vertical">К3</div></th>
					<th   name="id17" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС1</div></th>
					<th   name="id18" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС2</div></th>
					<th   name="id19" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС3</div></th>
					<th   name="id20" class="id7" style="display: table-cell;"><div class="vertical">МОЭВС4</div></th>
				</TR>
			</thead>

	<tbody>

	</tbody>
</table>
</body>

</html>

Цитата:

Сообщение от Arukueido

Допустим это H11, как мне найти и обратиться к заголовку H1

На рендере записать во все заголовки нижней строки указатель на родителя - верхнюю строку.