复制代码
代码如下:<!DOCTYPE
html>
<html>
<head>
<meta
charset="utf-8">
<title></title>
<script
type="text/javascript">
window.onload=function(){
var
oTab=document.getElementById("tab")
var
oBt=document.getElementsByTagName("input")
oBt[1].onclick=function(){
for(var
i=0i<oTab.tBodies[0].rows.lengthi++)
{
var
str1=oTab.tBodies[0].rows[i].cells[1].innerHTML.toUpperCase()
var
str2=oBt[0].value.toUpperCase()
//使用string.toUpperCase()(将字符串中的字符全部转换成大写)或string.toLowerCase()(将字符串中的字符全部转换成小写)
//所谓忽略大小写的搜索就是将用户输入的字符串全部转换大写或小写,然后把信息表中的字符串的全部转换成大写或小写,最后再去比较两者转换后的字符就行了
/*******************************JS实现表格忽略大小写搜索*********************************/
if(str1==str2){
oTab.tBodies[0].rows[i].style.background='red'
}
else{
oTab.tBodies[0].rows[i].style.background=''
}
/***********************************JS实现表格的模糊搜索*************************************/
//表格的模糊搜索的就是通过JS中的一个search()方法,使用格式,string1.search(string2)如果
//用户输入的字符串是其一个子串,就会返回该子串在主串的位置,不匹配则会返回-1,故操作如下
if(str1.search(str2)!=-1){oTab.tBodies[0].rows[i].style.background='red'}
else{oTab.tBodies[0].rows[i].style.background=''}
/***********************************JS实现表格的多关键字搜索********************************/
//表格的多关键字搜索,加入用户所输入的多个关键字之间用空格隔开,就用split方法把一个长字符串以空格为标准,分成一个字符串数组,
//然后以一个循环将切成的数组的子字符串与信息表中的字符串比较
var
arr=str2.split('
')
for(var
j=0j<arr.lengthj++)
{
if(str1.search(arr[j])!=-1){oTab.tBodies[0].rows[i].style.background='red'}
}
}
}
}
</script>
</head>
<body>
姓名:<input
type="text"
/>
<input
type="button"
value="搜索"/>
<table
border="1"
bordercolor="blue"
id="tab">
<thead>
<td><h2>ID</h2></td>
<td><h2>Name</h2></td>
<td><h2>Age</h2></td>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Blue</td>
<td>15</td>
</tr>
<tr>
<td>2</td>
<td>Mikyou</td>
<td>26</td>
</tr>
<tr>
<td>3</td>
<td>weak</td>
<td>24</td>
</tr>
<tr>
<td>4</td>
<td>sky</td>
<td>35</td>
</tr>
<tr>
<td>5</td>
<td>李四</td>
<td>18</td>
</tr>
</tbody>
</table>
</body>
</html>
希望本文所述对大家的javascript程序设计有所帮助。
这里有一个简单的站内搜索功能
<SCRIPT language=javascript><!--
function go(formname)
{
var url = http://www.163ns.com
formname.method = "get"
if (formname.myselectvalue.value == "1") {
document.search_form1.word.value = document.search_form1.word.value " site:www.163ns.com"
}
formname.action = url
return true
}
//-->
</SCRIPT>
<form name="search_form1" target="_blank" onsubmit="return go(this)">
<input name=word size="30" value="请输入关键字" onMouseOver="this.focus()" onBlur="if (value ==''){value='请输入关键字'}" onFocus="this.select()" onClick="if(this.value=='请输入关键字')this.value=''">
<input type="submit" value="搜索"><br>
<INPUT name=myselectvalue type=hidden value=0>
<INPUT name=tn type=hidden value="sayyes">
<INPUT name=cl type=hidden value="3">
<INPUT CHECKED name=myselect onclick=javascript:this.form.myselectvalue.value=0 type=radio value=0>
<FONT color=#0000cc style="FONT-SIZE: 12px">互联网
<INPUT name=myselect onclick=javascript:this.form.myselectvalue.value=1 type=radio value=1>
<FONT color=#ff0000 style="FONT-SIZE: 12px">站内
</form>