Question

以下HTML是我必须使用的我无法更改HTML或如何构建HTML 简单的JS也是一个要求，所以没有jQuery解决方案。

解决方案应该是一个包含我正在寻找的表格的变量所以在这个方向： var tableContent = getElementSomehow()

我所指的表格从第87行开始，如下所示：<table border=0 CLASS='notifications'>

可能有用的另一个信息是，所引用的表始终是整个HTML中的第四个表。

HTML：

<html>
<head>
<link rel="shortcut icon" href="/nagios3/images/favicon.ico" type="image/ico">
<title>
Alert Notifications
</title>
<LINK REL='stylesheet' TYPE='text/css' HREF='/nagios3/stylesheets/common.css'>
<LINK REL='stylesheet' TYPE='text/css' HREF='/nagios3/stylesheets/notifications.css'>
</head>
<body CLASS='notifications'>

<!-- Produced by Nagios (http://www.nagios.org).  Copyright (c) 1999-2007 Ethan Galstad. -->
<table border=0 width=100%>
<tr>
<td align=left valign=top width=33%>
<TABLE CLASS='infoBox' BORDER=1 CELLSPACING=0 CELLPADDING=0>
<TR><TD CLASS='infoBox'>
<DIV CLASS='infoBoxTitle'>Contact Notifications</DIV>
Last Updated: Wed Jul 8 12:05:50 CEST 2015<BR>
Nagios&reg; Core&trade; 3.5.1 - <A HREF='http://www.nagios.org' TARGET='_new' CLASS='homepageURL'>www.nagios.org</A><BR>
Logged in as <i>kavan</i><BR>
</TD></TR>
</TABLE>
</td>
<td align=center valign=top width=33%>
<DIV ALIGN=CENTER CLASS='dataTitle'>
All Contacts</DIV>
<BR>
<table border=0 cellspacing=0 cellpadding=0 CLASS='navBox'>
<tr>
<td align=center valign=center CLASS='navBoxItem'>
Latest Archive<br><a href='notifications.cgi?contact=all&type=0&archive=1'><img src='/nagios3/images/left.gif' border=0 alt='Latest Archive' title='Latest Archive'></a></td>
<td width=15></td>
<td align=center CLASS='navBoxDate'>
<DIV CLASS='navBoxTitle'>Log File Navigation</DIV>
Wed Jul 8 00:00:00 CEST 2015<br>to<br>Present..</td>
<td width=15></td>
<td><img src='/nagios3/images/empty.gif' border=0 width=75 height=1></td>
</tr>
</table>
<BR><DIV CLASS='navBoxFile'>File: /var/log/nagios3/nagios.log</DIV>
</td>
<td align=right valign=top width=33%>
<form method='GET' action='notifications.cgi'>
<input type='hidden' name='contact' value='all'>
<input type='hidden' name='archive' value='0'>
<table border=0 CLASS='optBox'>
<tr>
<td align=left colspan=2 CLASS='optBoxItem'>Notification detail level for all contacts:</td></tr>
<tr>
<td align=left colspan=2 CLASS='optBoxItem'><select name='type'>
<option value=0 selected>All notifications
<option value=1 >All service notifications
<option value=2 >All host notifications
<option value=8192 >Service custom
<option value=512 >Service acknowledgements
<option value=4 >Service warning
<option value=8 >Service unknown
<option value=16 >Service critical
<option value=32 >Service recovery
<option value=2048 >Service flapping
<option value=16384 >Host custom
<option value=1024 >Host acknowledgements
<option value=64 >Host down
<option value=128 >Host unreachable
<option value=256 >Host recovery
<option value=4096 >Host flapping
</select></td>
</tr>
<tr>
<td align=left CLASS='optBoxItem'>Older Entries First:</td>
<td></td>
</tr>
<tr>
<td align=left valign=bottom CLASS='optBoxItem'><input type='checkbox' name='oldestfirst' ></td><td align=right CLASS='optBoxItem'><input type='submit' value='Update'></td>
</tr>
<tr><td></td><td align=right valign=bottom>
<a href='/nagios3/contexthelp/F1.html' target='cshw' onClick='javascript:window.open("/nagios3/contexthelp/F1.html","cshw","width=550,height=600,toolbar=0,location=0,status=0,resizable=1,scrollbars=1");return true'><img src='/nagios3/images/contexthelp1.gif' border=0 alt='Display context-sensitive help for this screen' title='Display context-sensitive help for this screen'></a>
</td></tr>
</table>
</form>
</td>
</tr>
</table>
<p>
<div align='center'>
<table border=0 CLASS='notifications'>
<tr>
<th CLASS='notifications'>Host</th>
<th CLASS='notifications'>Service</th>
<th CLASS='notifications'>Type</th>
<th CLASS='notifications'>Time</th>
<th CLASS='notifications'>Contact</th>
<th CLASS='notifications'>Notification Command</th>
<th CLASS='notifications'>Information</th>
</tr>
<tr CLASS='notificationsEven'>
<td CLASS='notificationsEven'><a href='extinfo.cgi?type=1&host=VLADIMIR'>VLADIMIR</a></td>
<td CLASS='notificationsEven'><a href='extinfo.cgi?type=2&host=VLADIMIR&service=VMWare%3A+Status'>VMWare: Status</a></td>
<td CLASS='notificationsCRITICAL'>CRITICAL</td>
<td CLASS='notificationsEven'>2015-07-08 12:02:20</td>
<td CLASS='notificationsEven'><a href='config.cgi?type=contacts#it'>it</a></td>
<td CLASS='notificationsEven'><a href='config.cgi?type=commands#notify-by-email'>notify-by-email</a></td>
<td CLASS='notificationsEven'>CRITICAL: Execution time too long!</td>
</tr>
<tr CLASS='notificationsOdd'>
<td CLASS='notificationsOdd'><a href='extinfo.cgi?type=1&host=HP2520-EDV'>HP2520-EDV</a></td>
<td CLASS='notificationsOdd'>N/A</td>
<td CLASS='notificationsHOSTDOWN'>HOST DOWN</td>
<td CLASS='notificationsOdd'>2015-07-08 11:48:20</td>
<td CLASS='notificationsOdd'><a href='config.cgi?type=contacts#it'>it</a></td>
<td CLASS='notificationsOdd'><a href='config.cgi?type=commands#host-notify-by-email'>host-notify-by-email</a></td>
<td CLASS='notificationsOdd'>CRITICAL - Host Unreachable (192.168.1.206)</td>
</tr>
</table>
</div>
</p>

<!-- Produced by Nagios (http://www.nagios.org).  Copyright (c) 1999-2007 Ethan Galstad. -->
</body>
</html>

Answer 1

您可以使用document.getElementByClassName('infobox')然后迭代所有元素并找到所需的元素。

Answer 2

可能有用的另一个信息是，参考的表格，始终是整个HTML中的第四个表。

如果它是文档中的第4个表格。你可以试试

var tableContent = document.getElementsByTagName('table')[3];

Answer 3

这样的事情：

var elements = document.getElementsByClassName('notifications');

for (var i = 0; i < elements.length; i++) {
  // do stuff with each element here 
}

Answer 4

根据您必须支持的浏览器，您可以使用简单的CSS查询和querySelector功能。

var tbl = document.querySelector('table.notifications')

如何在普通JS中获取一个没有ID并且多次存在的元素

4 个答案: