getTable

HanLeiaLukeYodaObi-WanJabbaChewieAnakinC-3POR2-D2
6 amSleepingShowerForce
Training
Walking forestMeditationSleepingSleepingForce
Training
BootingBooting
7 amMakeupSleepingBreakfastVirus ScanCleaning
8 amBreakfastBreakfastMeditationVirus Scan
9 amConferenceForce
Training
TeachingDrinkingBreakfastConference
with Leia
Conference
with Leia
10 amWaking Up,
Breakfast
TeachingBreakfastConference
11 amLunchEating StrangeMaintenance
12 pmMaintenanceLunchLunchLunchForce
Training
Military
Training
Installing NewInstalling New
1 pmBuying-inInspectionForce
Training
SleepingWatching DanceBuying-inInspection
with Leia
2 pmLunchInspection
with Leia
3 pmLunchTeachingFarmingDrinkingLunchForce
Training
4 pmNavigatingSaber
Training
Military
Training
Walking forestNavigatingServicingCleaning
5 pm
6 pmDeliveringSleepingBathDeliveringCleaning
7 pmNavigatingBathDinnerDinnerNavigatingInspectionBacking
Up Data
Servicing
8 pmReadingReadingEating StrangeBacking
Up Data
9 pmDinnerDinnerDinnerDinnerSaber
Mending
Sleep Mode,
Battery
Charging
10 pmShowerWalking forestSleepingDrinkingSleepingSleep Mode,
Battery
Charging
11 pmNavigatingStudySaber
Mending
12 amDrinkingSleepingSleepingSleeping
1 amSleepingEating Strange
2 am
3 amSleeping
4 amWalking forestSleeping
5 amMeditation

npm GitHub issues David license

Move mouse on below

The simple jQuery Plugin for easy getting the table cells that are positioned on the horizontal line, the vertical line or both lines that pass through the target cell.

// Get rows that include target cell.
rows = $('td#target').getTable('rows');

// Get cols that include target cell.
cols = $('td#target').getTable('cols');

// Get cells that are included in the cross line (rows and cols) of target cell.
// And style those.
cells = $('td#target').getTable('xCells').css('backgroundColor', 'blue');

Getting Started

Load after jQuery.

<script src="jquery-1.11.0.min.js"></script>
<script src="jquery.gettable.min.js"></script>

Methods

rows

rows = target.getTable('rows')

Return an Array that includes zero or more rows. The row is a jQuery object that includes zero or more cell (<td> or <th>) elements that are positioned on a horizontal line. The cells in the row are sorted by position as from left to right, regardless of the HTML source order. For example, row.eq(0) is leftmost cell like the header.
(If you want to do something to all cells in rows together (you want to do nothing to each row), use rowsCells method.)
The elements are selected according to the each element that is included in current target jQuery object. The returned rows is one Array that includes all of those.

An element that is included in current target jQuery object is:

var hl; // keep to restore
$('td').hover(function() {
  hl = $(this).getTable('rows')[0].addClass('highlight');
}, function() {
  hl.removeClass('highlight');
});

In any cases, the nested table (table that is included in current target) is excluded (If part of the nested table is target too, of course it is included).

rowsCells

cells = target.getTable('rowsCells')

Return a jQuery object that includes zero or more cell (<td> or <th>) elements that are included in all rows that selected by same way as rows method. The returned cells is one jQuery object that includes all of those.
(If you want to do something to each row (you want to do nothing to all cells in rows together), use rows method.)

This is not the same as merged all cells that are returned by rows method, rowsCells method returns unique cells, duplicated elements are excluded.

cols

cols = target.getTable('cols')

Return an Array that includes zero or more cols. The col is a jQuery object that includes zero or more cell (<td> or <th>) elements that are positioned on a vertical line. The cells in the col are sorted by position as from top to bottom, regardless of the HTML source order. For example, col.eq(0) is uppermost cell like the header.
(If you want to do something to all cells in cols together (you want to do nothing to each col), use colsCells method.)
The elements are selected according to the each element that is included in current target jQuery object. The returned cols is one Array that includes all of those.

An element that is included in current target jQuery object is:

var hl; // keep to restore
$('td').hover(function() {
  hl = $(this).getTable('cols')[0].addClass('highlight');
}, function() {
  hl.removeClass('highlight');
});

In any cases, the nested table (table that is included in current target) is excluded (If part of the nested table is target too, of course it is included).

Temperature (degree Celsius)
JanFebMarAprMayJunJulAugSepOctNovDec
City-A3.24.65.58.116.618.720.225.121.215.610.66.9
City-B4.86.110.216.723.722.017.611.17.1
City-C5.28.514.118.621.725.227.123.212.67.9
City-D6.35.68.915.118.923.128.423.817.79.1
City-E6.79.219.125.429.217.917.39.3
City-F6.815.419.326.229.124.118.6

colsCells

cells = target.getTable('colsCells')

Return a jQuery object that includes zero or more cell (<td> or <th>) elements that are included in all cols that selected by same way as cols method. The returned cells is one jQuery object that includes all of those.
(If you want to do something to each col (you want to do nothing to all cells in cols together), use cols method.)

This is not the same as merged all cells that are returned by cols method, colsCells method returns unique cells, duplicated elements are excluded.

cells

cells = target.getTable('cells')

Return a jQuery object that includes zero or more cell (<td> or <th>) elements. The elements are selected according to the each element that is included in current target jQuery object. The returned cells is one jQuery object that includes all of those.

An element that is included in current target jQuery object is:

$('#targetRow').getTable('cells').css('backgroundColor', 'blue');

In any cases, the nested table (table that is included in current target) is excluded (If part of the nested table is target too, of course it is included).

xCells

cells = target.getTable('xCells')

Return a jQuery object that includes zero or more cell (<td> or <th>) elements that are positioned on the cross line (horizontal line and vertical line) that pass through the each element that is included in current target jQuery object. The returned cells is one jQuery object that includes all of those. The first cell of that cells is current target. i.e. cells.eq(0) is a cell on the cross point.
The elements that are not cell (<td> or <th>) are ignored.

This is not the same as merged all cells that are returned by rows method and cols method, xCells method returns unique cells, duplicated elements are excluded.

The nested table (table that is included in current target) is excluded (If part of the nested table is target too, of course it is included).

For example:

var hl; // keep to restore
$('td').hover(function() {
  hl = $(this).getTable('xCells').addClass('highlight');
}, function() {
  hl.removeClass('highlight');
});
ABCDEFGHI
1
2
3
4
5

table

table = target.getTable('table')

Return a jQuery object that includes zero or more table (<table>) elements. The <table> elements that are included in current target jQuery object, and the <table> elements that have <tr>, <td>, <th>, <thead>, <tfoot> or <tbody> elements that are included in current target jQuery object are selected. The returned table is one jQuery object that includes all of those (duplicated elements are excluded).

Initialize

target.getTable()

Parse the table, and cache those data.
You usually don't need to call initialize method, because getTable parses it automatically when getTable met the unknown table via other methods. And getTable caches those data, therefore parsing again is not needed.
The cases of initialize method is needed are:

If the element that is included in current target jQuery object is <table>, that table is parsed. If the element is part of the table (<tr>, <td>, <th>, <thead>, <tfoot> or <tbody>), the table that has those parts is parsed.
i.e. these codes below are equals:

$('table#table1').getTable();
$('table#table1>tbody:eq(0)').getTable();
$('table#table1>tbody:eq(0)>tr:eq(0)').getTable();
$('table#table1>tbody:eq(0)>tr:eq(0)>td:eq(0)').getTable();

getTable discern the nested table correctly, therefore if <td> of only the inner table is given, the outer table is not parsed.

Note

The cell extending by colspan="0" and <colgroup> is not supported. Now, the browser that supports this is Firefox only.