<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title></title>

    <script type="text/javascript">

        window.onload = function () {

            // var str = "avdfklksd";

            //alert(str.search('d'));//找到字符串出现的位置，如果没找到返回-1

            var oName = document.getElementById("txtname");

            var oBtn = document.getElementById("btnSearch");

            var oTab = document.getElementById("tb1");

            oBtn.onclick = function () {

                for (i = 0; i < oTab.tBodies[0].rows.length; i++) {

                    var oStr = oTab.tBodies[0].rows[i].cells[1].innerText.toLocaleLowerCase();

                    var oText = oName.value.toLocaleLowerCase();

                    if (oStr.search(oText) != -1) {

                        oTab.tBodies[0].rows[i].style.background = "yellow";

                    }

                    else {

                        oTab.tBodies[0].rows[i].style.background = "";

                    }

                }

            }

        }

    </script>

</head>

<body>

    <input type="text" name="txtname" id="txtname" /><input type="button" value="搜索" id="btnSearch" />

    <table id="tb1" border="1" style="width: 500px;">

        <thead>

            <tr>

                <td>ID</td>

                <td>姓名</td>

                <td>年龄</td>

            </tr>

        </thead>

        <tbody>

            <tr>

                <td>1</td>

                <td>Cupid</td>

                <td>66</td>

            </tr>

            <tr>

                <td>2</td>

                <td>Fly</td>

                <td>45</td>

            </tr>

            <tr>

                <td>3</td>

                <td>Sky</td>

                <td>23</td>

            </tr>

            <tr>

                <td>4</td>

                <td>Windy</td>

                <td>98</td>

            </tr>

            <tr>

                <td>5</td>

                <td>Snow</td>

                <td>09</td>

            </tr>

        </tbody>

    </table>

</body>

</html>

　　

Javascript表格中搜索的更多相关文章

  1. Jquery在表格中搜索关键字

    <!DOCTYPE html><html><head> <title>ddd</title></head><body> ...

  2. JavaScript在表格中模拟搜索多关键词搜索和筛选

    模拟搜索需要实现以下功能: 1.用户的模糊搜索不区分大小写,需要小写字母匹配同样可以匹配到该字母的大写单词. 2.多关键词模糊搜索,假设用户关键词以空格分隔,在关键词不完整的情况下仍然可以匹配到包含该 ...

  3. JavaScript表格搜索高亮功能模拟

    在网页表格中模拟excle的搜索高亮显示功能.当在搜索框中输入需要的姓名时,若表格中存在对应的数据,则该表格背景色变为黄色. 下面为表的HTML源码: <!doctype html> &l ...

  4. 在DOM中搜索元素

    方法 现代浏览器中使用XPath document.getElementById document/node.getElementsByTagName Limit search by parent e ...

  5. 分享12款 JavaScript 表格控件（DataGrid）

    JavaScript 表格控件可以操作大数据集的 HTML 表格,提供各种功能,如分页.排序.过滤以及行编辑.在本文中,我们整理了13个最好的 JavaScript 表格插件分享给开发人员,开发者可以 ...

  6. 12款 JavaScript 表格控件（DataGrid）

    JavaScript 表格控件可以操作大数据集的 HTML表格,提供各种功能,如分页.排序.过滤以及行编辑.在本文中,我们整理了13个最好的 JavaScript 表格插件分享给开发人员,开发者可以很 ...

  7. ajax异步获取数据后动态向表格中添加数据(行)

    因为某些原因,项目中突然需要做自己做个ajax异步获取数据后动态向表格中添加数据的页面,网上找了半天都没有 看到现成的,决定自己写个例子 1.HTML页面 <!doctype html> ...

  8. javascript作用域中令你意想不到的问题

    大多数类c的语言,由一对花括号封闭的代码块就是一个作用域.但是javascript的作用域则是通过函数来定义.在一个函数中定义的变量只对这个函数内部可见,我们称为函数作用域. 1.在函数中引用一个变量 ...

  9. 使用jquery合并表格中相同文本的相邻单元格

    一.效果 二.代码 <!DOCTYPE HTML> <html> <head> <title>Example</title> <met ...

随机推荐

  1. sicily 1027 MJ, Nowhere to Hide 字符串匹配与排序

    1027. MJ, Nowhere to Hide Constraints Time Limit: 1 secs, Memory Limit: 32 MB Description On BBS, th ...

  2. 使用 CocoStudio UI 编辑器实现《乱斗堂》设置界面

    由于是引用别人的,所以直接贴上地址了.http://www.cocoachina.com/bbs/read.php?tid=164820&fpage=7 1 游戏中必不可少的 UI 元素    ...

  3. photoshop如何把阴影分离开（让阴影单独成为一个图层）

    作图的时候经常会用到,给图片加个投影,但有时还满足不了自己的需要,于是可以把投影分离开来单独操作投影. 图层->图层样式->创建图层 有时还需要滤镜->模糊 一下 哈哈,下次忘了来翻 ...

  4. mysql颠覆实战笔记(四)--商品系统设计(一):商品主表设计

    版权声明:笔记整理者亡命小卒热爱自由,崇尚分享.但是本笔记源自www.jtthink.com(程序员在囧途)沈逸老师的<web级mysql颠覆实战课程 >.如需转载请尊重老师劳动,保留沈逸 ...

  5. js 统计字符串中出现次数最多的字符？

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. 使用HttpWebRequest以及HttpWebResponse读取Http远程文件

     主页>杂项技术>.NET(C#)> 使用HttpWebRequest以及HttpWebResponse读取Http远程文件 jackyhwei 发布于 2010-08-15 21: ...

  7. RAID 0+1

    正如其名字一样RAID 0+1是RAID 0和RAID 1的组合形式,也称为RAID 01. 以四个磁盘组成的RAID 0+1为例,其数据存储方式如图所示:RAID 0+1是存储性能和数据安全兼顾的方 ...

  8. Linux下iptables拦截Nginx的问题

    环境:CentOS 6.4 X64,Nginx 1.5.3 问题:配置好Nginx后,加入了“iptables -A INPUT -p tcp -m tcp --dport 80 -j ACCEPT” ...

  9. centos系统下安装使用composer教程

    Composer 是 PHP 的一个依赖管理工具.它允许你申明项目所依赖的代码库,它会在你的项目中为你安装他们.Composer 不是一个包管理器.是的,它涉及 "packages" ...

  10. SQL中的自定义函数Function

    先给出一个链接吧,别人写的:http://www.cnblogs.com/diony/archive/2010/12/17/1909014.html 总结得很全面,感谢感谢!自己练习了一下后面的例子, ...