我的来源如下:
<html>
<head>
<title>Southwest Pumps: Fire Pump Sales and Services</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://use.fontawesome.com/3fe3352e0f.js"></script>
<link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/stylesheets/style.css">
</head>
<body>
<div class="container">
<a class="btn btn-xs btn-primary" href="/sales/new">Create New Job Entry</a>
<table class="table table-striped table-dark">
<thead>
<tr>
<th>Customer Name</th>
<th>Job Name</th>
<th>Last Edited</th>
<th>Editor</th>
<th>Link to Job</th>
</tr>
</thead>
<tbody id="tbody">
<a style="display:block" href="/sales/5b428cd7b87ffb0aa03c94f2">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate0" value="Tue Jul 10 2018 21:21:47 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b428cd7b87ffb0aa03c94f2">Link</a></td>
</tr>
</a>
<a style="display:block" href="/sales/5b429ff7b87ffb0aa03c94f6">
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate1" value="Tue Jul 10 2018 21:22:27 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b429ff7b87ffb0aa03c94f6">Link</a></td>
</tr>
</a>
<a style="display:block" href="/sales/5b42b24eb87ffb0aa03c94f8">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate2" value="Tue Jul 10 2018 21:23:40 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b42b24eb87ffb0aa03c94f8">Link</a></td></tr>
</a>
<a style="display:block" href="/sales/5b44f07d7945fe0e5388efd6">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate3" value="Tue Jul 10 2018 21:30:46 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b44f07d7945fe0e5388efd6">Link</a></td>
</tr>
</a>
<a style="display:block" href="/sales/5b43b048601191087dc0b618">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate4" value="Tue Jul 10 2018 21:33:22 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b43b048601191087dc0b618">Link</a></td>
</tr>
</a>
<a style="display:block" href="/sales/5b44bc6b7945fe0e5388efd2">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate5" value="Mon Jul 09 2018 18:58:16 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b44bc6b7945fe0e5388efd2">Link</a></td>
</tr>
</a>
<a style="display:block" href="/sales/5b450a6c7945fe0e5388efd8">
<tr>
<td>Customer</td>
<td>Job</td>
<td><input type="hidden" id="inputdate6" value="Tue Jul 10 2018 21:33:34 GMT+0000 (UTC)"></input></td>
<td>LeslieSmooth</td>
<td><a class="btn btn-xs btn-primary" href="/sales/5b450a6c7945fe0e5388efd8">Link</a></td>
</tr>
</a>
</tbody>
</table>
</div>
<!-- jQuery CDN -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256- hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<!-- Bootstrap JS CDN -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js">
</script>
<!-- Genaric Scripts -->
<script type="text/javascript" src="/scripts/script.js"></script>
</body>
</html>
但是DOM将我所有的锚元素移到TABLE上方,由于某种原因,它最终看起来像这样。
我的目标是使表的整个行成为链接到特定数据库ID的锚元素。我对发生的事情一无所知。任何帮助表示赞赏!
...<div class="container">
<a class="btn btn-xs btn-primary" href="/sales/new">Create New Job Entry</a>
<a style="display:block" href="/sales/5b428cd7b87ffb0aa03c94f2"></a>
<a style="display:block" href="/sales/5b429ff7b87ffb0aa03c94f6"></a>
<a style="display:block" href="/sales/5b42b24eb87ffb0aa03c94f8"></a>
<a style="display:block" href="/sales/5b44f07d7945fe0e5388efd6"></a>
<a style="display:block" href="/sales/5b43b048601191087dc0b618"></a>
<a style="display:block" href="/sales/5b44bc6b7945fe0e5388efd2"></a>
<a style="display:block" href="/sales/5b450a6c7945fe0e5388efd8"></a>
<table class="table table-striped table-dark">
<thead>
<tr>
<th>Customer Name</th>
<th>Job Name</th>
<th>Last Edited</th>
<th>Editor</th>
<th>Link to Job</th>
</tr>
</thead>
<tbody id="tbody">
<tr>...
我正在使用Bootstrap。而且我正在使用NodeJS / Express和EJS生成锚标记。
JIC我的EJS代码如下:
...<div class="container">
<a class="btn btn-xs btn-primary" href="/sales/new">Create New Job Entry</a>
<table class="table table-striped table-dark">
<thead>
<tr>
<th>Customer Name</th>
<th>Job Name</th>
<th>Last Edited</th>
<th>Editor</th>
<th>Link to Job</th>
</tr>
</thead>
<tbody id="tbody">
<% for (var i = 0; i < jobs.length; i++) { %>
<a href="/sales/<%= jobs[i]._id %>" style="display: block;">
<tr>
<td><%= jobs[i].customer %></td>
<td><%= jobs[i].name %></td>
<td><input type="hidden" id="inputdate<%= [i] %>" value="<%= jobs[i].lastEdited %>"></input><span class="date-class" id="spandate<%= [i] %>"> </span></td>
<td><%= jobs[i].editors[jobs[i].editors.length - 1].username %></td>
<td><a class="btn btn-xs btn-primary" href="/sales/<%= jobs[i]._id %>">Link</a></td>
</tr>
</a>
<% } %>
</tbody>
</table>
</div>...