<legend>P1</legend> <table> <tr> <th scope="row"><label>Link State</label></th> <td><span id="wr1_link">-</span></td> </tr> <tr> <th scope="row"><label>Lock State</label></th> <td><span id="wr1_lock">-</span></td> </tr> <tr> <th scope="row"><label>Sync State</label></th> <td><span id="wr1_sync">-</span></td> </tr> <tr> <th scope="row"><label>Tranceive Bytes</label></th> <td><span id="wr1_tranceive">-</span></td> </tr> <tr> <th scope="row"><label>Sync Source</label></th> <td><span id="wr1_source">-</span></td> </tr> <tr> <th scope="row"><label>Loopback Time(ps)</label></th> <td><span id="wr1_loopback">-</span></td> </tr> <tr> <th scope="row"><label>Oneway Time(ps)</label></th> <td><span id="wr1_oneway">-</span></td> </tr> <tr> <th scope="row"><label>Link Time</label></th> <td><span id="wr1_linktime">-</span></td> </tr> </table> <legend>P2</legend> <table> <tr> <th scope="row"><label>Link State</label></th> <td><span id="wr0_link">-</span></td> </tr> <tr> <th scope="row"><label>Lock State</label></th> <td><span id="wr0_lock">-</span></td> </tr> <tr> <th scope="row"><label>Sync State</label></th> <td><span id="wr0_sync">-</span></td> </tr> <tr> <th scope="row"><label>Tranceive Bytes</label></th> <td><span id="wr0_tranceive">-</span></td> </tr> <tr> <th scope="row"><label>Sync Source</label></th> <td><span id="wr0_source">-</span></td> </tr> <tr> <th scope="row"><label>Loopback Time(ps)</label></th> <td><span id="wr0_loopback">-</span></td> </tr> <tr> <th scope="row"><label>Oneway Time(ps)</label></th> <td><span id="wr0_oneway">-</span></td> </tr> <tr> <th scope="row"><label>Link Time</label></th> <td><span id="wr0_linktime">-</span></td> </tr> </table> 判断wr0_link的值 如果值为1 则让P2的表格亮一点 让P1的表格灰一点 如果值为0 则让P1的表格亮一点 P2的表格灰一点
时间: 2023-07-09 13:16:47 浏览: 52
根据你提供的代码,我可以给出如下的JavaScript代码来实现你的要求:
```
var wr0_link = document.getElementById("wr0_link").innerText;
if (wr0_link == "1") {
// 如果 wr0_link 值为 1,则让 P2 的表格亮一点,让 P1 的表格灰一点
document.querySelector("legend:nth-of-type(2)").style.opacity = "1";
document.querySelector("legend:nth-of-type(1)").style.opacity = "0.5";
} else if (wr0_link == "0") {
// 如果 wr0_link 值为 0,则让 P1 的表格亮一点,让 P2 的表格灰一点
document.querySelector("legend:nth-of-type(1)").style.opacity = "1";
document.querySelector("legend:nth-of-type(2)").style.opacity = "0.5";
}
```
这段代码的作用是获取 ID 为 `wr0_link` 的元素的文本内容(即 `wr0_link` 的值),然后根据值的不同设置两个 `<legend>` 元素的不透明度,从而实现让 P1 或 P2 的表格亮一点的效果。
相关问题
<legend class="field_title"> <a href="#" class="easyui-linkbutton" plain="true" onclick="addTableRow()"><i class="fa fa-plus-circle fa-lg fa-fw fa-col"></i>增加行</a> </legend> <table style="width: 100%;"> <thead > <tr> <th>操作</th> <th>提单号/运单号</th> <th>一程日期</th> <th>二程日期</th> <th>预计到货日期</th> <th>海船公司</th> <th>放箱日期</th> <th>放箱单上传</th> </tr> <tr> <td><input type="button" name="comment" value="删除"></td> <td><input type="text" name="comment"></td> <td><input type="date" name="date1"></td> <td><input type="date" name="date2"></td> <td><input type="date" name="date3"></td> <td><input type="text" name="commen1t"></td> <td><input type="date" name="date4"></td> <td><input type="file" name="attachment"></td> </tr> </thead> </table>新增和删除
在上述代码中,使用了一个`<table>`元素来呈现表格,并在表格的第一行添加了一个`<legend>`元素作为标题。在第一行的标题中,使用了一个`<a>`元素来实现“增加行”功能,并为它添加了一个`onclick`事件,当用户点击时会调用JavaScript中的`addTableRow()`函数。
在表格的第二行开始,使用`<thead>`元素来定义表格的表头,其中包括每个列的标题。在每个单元格中,使用`<input>`元素来呈现表格中的数据,并根据需要设置不同的`type`属性(如`text`, `date`, `file`等)。
在每一行的第一列中,使用了一个“删除”按钮,当用户点击该按钮时会调用JavaScript中的删除函数,从而实现删除该行的操作。
JavaScript代码示例(增加行和删除行):
```javascript
// 增加行
function addTableRow() {
var table = document.querySelector('table');
var newRow = table.insertRow(-1);
var cells = ['操作', '提单号/运单号', '一程日期', '二程日期', '预计到货日期', '海船公司', '放箱日期', '放箱单上传'];
for (var i = 0; i < cells.length; i++) {
var cell = newRow.insertCell(i);
if (i === 0) {
cell.innerHTML = '<input type="button" name="comment" value="删除" onclick="deleteTableRow(this)">';
} else {
cell.innerHTML = '<input type="text" name="comment">';
}
}
}
// 删除行
function deleteTableRow(button) {
var row = button.parentNode.parentNode;
row.parentNode.removeChild(row);
}
```
在`addTableRow()`函数中,首先找到表格元素,然后使用`insertRow()`方法在表格的末尾插入一行。接着,循环遍历每个单元格,并使用`insertCell()`方法将单元格插入到新行中,根据需要设置不同的内容和属性。在第一列中,使用`<input>`元素创建一个“删除”按钮,并为它添加一个`onclick`事件,当用户点击时会调用`deleteTableRow()`函数。最后,在`deleteTableRow()`函数中,找到要删除的行,并使用`removeChild()`方法将其从表格中删除。
<fieldset class="warp"> <legend>hxkakaxhak Anianmal</legend> <img src="shuimu.png" alt="shuimu" class="stand"> </fieldest>
根据提供的引用内容,这是一个HTML代码段,其中包含一个fieldset元素和一个legend元素,以及一个img元素。fieldset元素用于将表单中的相关元素分组,legend元素用于为fieldset元素定义标题。img元素用于在网页中插入图像。需要注意的是,代码中的fieldest应该是fieldset的拼写错误。
```html
<fieldset class="warp">
<legend>hxkakaxhak Anianmal</legend>
<img src="shuimu.png" alt="shuimu" class="stand">
</fieldset>
```
相关推荐
![zip](https://img-home.csdnimg.cn/images/20210720083736.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
<%-- Created by IntelliJ IDEA. User: syp Date: 2023/5/22 Time: 13:59 To change this template use File | Settings | File Templates. --%> <%@ page contentType="text/html;charset=UTF-8" language="java" %> <html> <head> <title>Denglu</title> </head> <body leftmargin="0" topmargin="0" marginheight="0" marginwidth="0"> <fieldset style="width: auto; margin: 0px auto"> <legend> 欢迎使用常州工业职业技术学院人员管理系统 </legend>
<form action="loginSuccess.action"> 用户:<input type="text" name="username"/>
密码:<input type="password" name="password"/>
<input type="submit" value="登录"/> 注册 </form> </fieldset> </body> </html>
<form action="loginSuccess.action"> 用户:<input type="text" name="username"/>
密码:<input type="password" name="password"/>
<input type="submit" value="登录"/> 注册 </form> </fieldset>
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)