一段javascript的页面搜索代码

最新推荐文章于 2022-11-14 14:13:40 发布
最新推荐文章于 2022-11-14 14:13:40 发布
阅读量1.2k 收藏
点赞数
分类专栏： Javascript 文章标签： javascript function character null 文档 button
/*
搜索文字核心程序,仿CRL+F,但功能更强的搜索
*/
<!--
var iFlag;
function search() {
var wPopupElements=wPopup.document.all;
if (wPopupElements.textcase.checked)
  {iFlag=4;}
else
  {iFlag=0;}
if (wPopupElements.searchtext.value==null || wPopupElements.searchtext.value=='')
  {
   wPopup.alert("请输入你要查找的文字");
   return;
  }
if (rng.findText(wPopupElements.searchtext.value,10000,iFlag)==true)
  {
   rng.select();
   rng.scrollIntoView();
   rng.moveStart("character");
  }
else
  {wPopup.alert("已查找到文档底部");}
}

function replace() {
var wPopupElements=wPopup.document.all;
if (wPopupElements.textcase.checked)
  {iFlag=4;}
else
  {iFlag=0;}
if (wPopupElements.searchtext.value==null || wPopupElements.searchtext.value=='')
  {
   wPopup.alert("请输入你要替换的文字");
   return;
  }
if (rng.findText(wPopupElements.searchtext.value,-10000,iFlag)==true)
  {
   rng.text = wPopupElements.replacetext.value;
  }
else
  {wPopup.alert("已替换到文档底部");}
}

function replaceall() {
var rng = document.body.createTextRange();
var wPopupElements=wPopup.document.all;
if (wPopupElements.textcase.checked)
  {iFlag=4;}
else
  {iFlag=0;}
if (wPopupElements.searchtext.value==null || wPopupElements.searchtext.value=='')
  {
   wPopup.alert("请输入你要替换的文字");
   return;
  }
  for (i=0; rng.findText(wPopupElements.searchtext.value,10000,iFlag)!=false; i++)
  {
   rng.scrollIntoView();
   rng.text = wPopupElements.replacetext.value;
  }
  setTimeout('wPopup.alert("共有"+i + " 项被替换")',200);
}
//-->


/*
弹出搜索窗口程序
*/
<!--
function gofind() {
wPopup=window.open('about:blank','','width=300 height=108 left=350 top=200 menubar=no resizeable=no scrollbars=no toolbar=no');
var wPopupDoc=wPopup.document;
wPopupDoc.open();
wPopupDoc.write('<html>/n');
wPopupDoc.write('<head>/n');
wPopupDoc.write('<title>文字搜索功能</title>/n');
wPopupDoc.write('<style>/n');
wPopupDoc.write('* {font-size:11px;font-family:"Tahoma","Verdana","Arial"}/n');
wPopupDoc.write('button {width:80}/n');
wPopupDoc.write('</style>/n');
wPopupDoc.write('</head>/n');
wPopupDoc.write('<body bgcolor="buttonface" leftmargin="0" topmargin="0">/n');
wPopupDoc.write('<table width="300" height="108" border="0" cellspacing="0" cellpadding="3" bgcolor="#F1F2DF">/n');
wPopupDoc.write('<tr>/n');
wPopupDoc.write('<td>查找:</td>/n');
wPopupDoc.write('<td><input type="text" name="searchtext" οnchange="window.opener.rng=window.opener.document.body.createTextRange()"></td>/n');
wPopupDoc.write('<td><button accesskey="S" name="searchbutton" οnclick="window.opener.search()">查找</button></td>/n');
wPopupDoc.write('</tr>/n');
wPopupDoc.write('<tr>/n');
wPopupDoc.write('<td>替换:</td>/n');
wPopupDoc.write('<td><input type="text" name="replacetext"></td>/n');
wPopupDoc.write('<td><button accesskey="R" name="replacebutton" οnclick="window.opener.replace()">替换</button></td>/n');
wPopupDoc.write('</tr>/n');
wPopupDoc.write('<tr>/n');
wPopupDoc.write('<td colspan="2"><input type="checkbox" name="textcase" value="textcase">区分大小写</td>/n');
wPopupDoc.write('<td><button accesskey="A" name="replaceallbutton" οnclick="window.opener.replaceall()">替换全部</button></td>/n');
wPopupDoc.write('</tr>/n');
wPopupDoc.write('<tr>/n');
wPopupDoc.write('<td colspan="2">&nbsp;</td>/n');
wPopupDoc.write('<td><button accesskey="C" name="cancelbutton" οnclick="window.close()">关闭</button></td>/n');
wPopupDoc.write('</tr>/n');
wPopupDoc.write('</table>/n');
wPopupDoc.write('</body>/n');
wPopupDoc.write('</html>/n');
wPopupDoc.close();
}
//-->
 
fableking
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
html+css实现精美搜索框
m0_62237068的博客
07-18 8288
搜索框使用户能够快速找到他们所需的信息，节省了浏览整个网站的时间和精力。无论是寻找特定的产品、服务、文章还是其他内容，用户可以通过输入关键词来快速定位相关页面。一、页面效果。
深入探索Holmes.js：轻量级页面搜索库
最新发布
gitblog_00053的博客
05-13 903
深入探索Holmes.js：轻量级页面搜索库 项目地址:https://gitcode.com/Haroenv/holmes 在现代网页开发中，快速有效的搜索功能变得越来越重要。今天我们要介绍的，是一个极其小巧且高效的开源项目——Holmes.js。这个仅约2KB大小的JavaScript库，让你能够轻松实现在页面中的搜索过滤。 项目简介 Holmes.js 是一个简洁且快速的页面内搜索解决方案，...
仅30行代码，实现一个搜索引擎(1.0版)
伤心的辣条
11-14 6065
说到搜索引擎，一般人都会觉得这东西十分“高大上”，对于不了解搜索引擎实现方式的小伙伴而言，确实能够感同身受。国内著名的搜索引擎代表非百度莫属，而国外著名的搜索引擎代表则非谷歌莫属了。搜索引擎一定程度上方便了网民的生活，生活或工作中啥不知道的上网搜索一下大都能找到答案。今天将会分享如何仅用30行左右的代码来实现一个简易版的搜索引擎，我先称之为1.0版本好啦～
JavaScript实现智能搜索框
行步至春深
11-09 3265
应用场景： 1. 搜索框在页面中占据的空间过小，希望无论浏览到什么位置，可以轻易地回到并聚焦搜索框。 2. 搜索框里面的文字大小过小，希望能够在上方开辟一块空间放大内容 解决思路： 1. 对整个页面添加键盘事件keyup类型的侦听器，然后使用e.keyCode属性来获得用户按下的键，如果是s/S，就让搜索框聚焦。 2. 对搜索框添加键盘事件keyup类型的侦听器，将搜索框的value赋给放大内容盒子(我用的是<p>标签)的innerText，如果不为空，就将盒子通过style.disp
javascript一段创建层的代码
10-30
在JavaScript中，创建层（或称为“div”元素）是一种常见的网页动态效果实现方式，用于构建复杂的布局或者添加交互性。下面将详细解释这段代码的工作原理及其涉及的关键知识点。 首先，我们看到一个CSS样式定义了一...
一段好玩的JavaScript代码
12-09
这段JavaScript代码是一个简单的动画效果，它能够改变网页中所有图片的位置，从而创造出一种动态流动的视觉体验。在浏览器的地址栏中输入这段代码并回车后，如果当前页面包含多个图片，这些图片将会按照预设的规则...
超实用的javascript代码段 源码
09-12
"超实用的javascript代码段"是席新亮著作的一个资源集合，提供了许多实际开发中常用且高效的代码片段，对于学习和提升JavaScript编程技能非常有帮助。 一、基础语法与类型 JavaScript的基础语法包括变量声明（var、...
把Javascript代码应用到网页中的方法
09-24
-->`用于旧版不支持JavaScript的浏览器，它们会忽略这段代码，以保持页面的正常显示。而`//`开头的双斜线注释是JavaScript的单行注释，对浏览器而言是不可见的。 2. **引用方式** 当JavaScript代码量较大或者需要...
简洁的一个实现网页全屏代码
10-30
这里我们将详细讨论如何通过JavaScript实现一个简洁的网页全屏代码。 首先，我们需要理解浏览器的全屏API。在现代浏览器中，Web API提供了`requestFullscreen()`方法，允许网页元素进入全屏模式。这个方法可以应用...
JS实现前端页面的搜索功能
10-18
主要介绍了JS实现前端页面的搜索功能，本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧
javascript html网页中的综合搜索引擎代码
11-16
js javascript html网页中的综合搜索引擎代码
前台框架·搜索页面代码
weixin_44588262的博客
06-26 777
整体结构 页面声明 资源文件 搜索表单 引入JS 初始化搜素页 表格操作 <!DOCTYPE HTML> <html> <head> <title> 搜索表单</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt...
静态页面用JS实现搜索功能
Kevincram的博客
02-02 6916
调用方法 highlight（）： function encode(s){   return s.replace(/&/g,"&").replace(//g,">").replace(/([\\\.\*\[\]\(\)\$\^])/g,"\\$1"); } function decode(s){   return s.replace(/\\([\\\.\*\[\]\(\)\$\^])
window.location.search的用法
别逗了好么
09-24 4092
location.search是从当前URL的?号开始的字符串 如:http://www.51js.com/viewthread.php?tid=22720 它的search就是?tid=22720 通过这个函数就可以轻易取到连接后面带的参数，这个可用户父窗口向子窗口传递参数 eg： Java代码： function openTable(id){     var feathe
# js，根据input框内容实时搜索列表,并添加底色以突出显示
SThranduil的博客
08-03 5706
js，根据input框内容实时搜索列表,并添加底色以突出显示js，根据input框内容实时搜索列表，纯前端，下面分三个部分进行展示： 首先，让我们看一下做出来的效果：1.html代码 2.js代码 3.css样式 1.html代码<li> <label>名称：</label> <input type="text" id="selectByName" name="selectByName" v
js实现简单的搜索框
qq_53430000的博客
09-02 2675
数组pop push shift unshift 的练习
html中的javascript代码怎么写
festone000的专栏
04-24 828
不需要 function(){}这个东西。
写一段好玩的JavaScript代码
05-05
好的，这里是一个简单的JavaScript代码，可以让你在网页上抓住一个可爱的小猫咪： ```javascript ...当你在网页上打开这段代码时，你会看到一个可爱的小猫咪在页面的右下角跑来跑去，你可以点击它，让它消失。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值