js 查询表格内容并加亮相应内容单元格

时间：2022-06-25 20:55:16 编辑：袖梨来源：一聚教程网

提示：您可以先修改部分代码再运行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">

<script language="javascript">
var ids;
var idstext;
function hightlight_td(){
	var text=txt.value;
	TDs=document.all.table1.all.tags("td")
	//使用iframe时:
	//TDs=iframe的name.document.all.table1.all.tags("TD")
	if(text!=""){
		for (var i=0;i<TDs.length;i++){
			obj=TDs[i];
			idstext=obj.innerText;
			idnum=idstext.indexOf(text);
			if(idnum!=-1){
				obj.style.background="red";
			}else{
				obj.style.background="#FFFFFF";
			}
		}
	}else{
		alert("请输入要查询的字符串！");
	}
}
</script>
</head>
<body>

<table border="1" cellspacing="0" width="400" cellpadding="0" id="table1">
  <tr>
    <td width="80">12</td>
    <td width="80">34</td>
    <td width="80">56</td>
    <td width="80">78</td>
    <td width="80">90</td>
  </tr>
  <tr>
    <td width="80">abc</td>
    <td width="80">def</td>
    <td width="80">ghj</td>
    <td width="80">lop</td>
    <td width="80">dry</td>
  </tr>
  <tr>
    <td width="80">!@#</td>
    <td width="80">_(*</td>
    <td width="80">#$%</td>
    <td width="80">^$#</td>
    <td width="80">WWW</td>
  </tr>
</table>
<input type="text" name="txt"><input type="button" value="请输入要查询的字符串，例如12" onClick="hightlight_td();"> 
</body>
</html>

提示：您可以先修改部分代码再运行

推荐专题

最新下载

热门教程

js 查询表格内容并加亮相应内容单元格

相关文章

热门栏目

php教程

asp.net教程

手机开发

css教程

网页制作

办公数码

jsp教程