本文目录一览:
- 1、js搜索框代码
- 2、JavaScript静态搜索
- 3、JS如何查找源代码
- 4、用JS将搜索的关键字高亮显示实现代码
- 5、求一段JS代码,要求搜索当前页面,如果发现当前页面中有设定的字符,就给出提示
- 6、如何查看网页的JS代码
js搜索框代码
/* 问题不够明确 */
input class="ipt_search" type="search" placeholder="请输入搜索内容"/
script
/* 搜索input */
var searchIpt = document.getElementsByClassName('ipt_search')[0];
/* 搜索内容 */
var searchValue = searchIpt.value;
/script
JavaScript静态搜索
代码:
1 form.htm
起始页面,页面里有查询框。
script language="javascript"
function gosearch(){
if (str.value==""){ alert ("请输入查找的内容!"); return false; }
window.location="query.htm?"+str.value;
}
function getkey(){
if(window.event.keyCode == 13) gosearch();
}
/script
input name="str" type="text" id="str" /
input type="button" name="Button" value="查找" onclick="gosearch()" /
script
str.focus();
document.onkeydown=getkey;
/script
2 query.htm
搜索页面,接收上个页面 传来的参数。
script language="javascript"
var titlearray = new Array(); //关键字数组
var urlarray = new Array(); //超级链接数组
var fitarray = new Array(); //符合要求的数组
/script
script type="text/javascript" src="title.js"/script//加载关键字
script type="text/javascript" src="url.js"/script//加载超级链接
script language="javascript"
var args = window.location.href.split("?");//用问号为间隔,各个参数写入数组args
var target = args[1]; //要找的字符串
for (var i=0; ititlearray.length; i++){
if (titlearray[i].indexOf(target)!=-1){
fitarray.push(i);//将要找的结果写入数组。也可以不用数组,直接显示。
}
}
var resultstr = "";
if (fitarray.length ==0 ){
resultstr += "抱歉,没有找到资料。";
}
for (j in fitarray){
resultstr += "a href=\""+ urlarray [fitarray[j]] +"\" target=\"_blank\""+ titlearray[fitarray[j]]+"
";//结果内容赋值给了resultstr
}
/script
div id="result"/div
script language="javascript"
document.getElementById("result").innerHTML += resultstr;//显示结果内容
/script
3 title.js 关键字文件
titlearray [0] = "keyword1";
titlearray [1] = "keyword2";
titlearray [2] = "keyword3";
url.js 超级链接文件
urlarray [0] = "1.htm";
urlarray [1] = "2.htm";
urlarray [2] = "3.htm";
这两个文件需要下标对应,不能错位。
JS如何查找源代码
html
head
meta http-equiv="Content-type" content="text/html; charset=utf-8"
title远程网页源代码读取/title
style type="text/css"
/* 页面字体样式 */
body, td, input, textarea {
font-family:Arial;
font-size:12px;
}
/style
script type="text/javascript"
//用于创建XMLHttpRequest对象
function createXmlHttp() {
//根据window.XMLHttpRequest对象是否存在使用不同的创建方式
if (window.XMLHttpRequest) {
xmlHttp = new XMLHttpRequest(); //FireFox、Opera等浏览器支持的创建方式
} else {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");//IE浏览器支持的创建方式
}
}
//直接通过XMLHttpRequest对象获取远程网页源代码
function getSource() {
var url = document.getElementById("url").value; //获取目标地址信息
//地址为空时提示用户输入
if (url == "") {
alert("请输入网页地址。");
return;
}
document.getElementById("source").value = "正在加载……"; //提示正在加载
createXmlHttp(); //创建XMLHttpRequest对象
xmlHttp.onreadystatechange = writeSource; //设置回调函数
xmlHttp.open("GET", url, true);
xmlHttp.send(null);
}
//将远程网页源代码写入页面文字区域
function writeSource() {
if (xmlHttp.readyState == 4) {
document.getElementById("source").value = xmlHttp.responseText;
}
}
/script
/head
body
h1远程网页源代码读取/h1
div
地址:input type="text" id="url"
input type="button" onclick="getSource()" value="获取源码"
/div
textarea rows="10" cols="80" id="source"/textarea
/body
/html
我也是别人那抄的 你试试吧 好的话给我个最佳
用JS将搜索的关键字高亮显示实现代码
用JS让文章内容指定的关键字加亮
是这样的..
现在有这些关键字:美容,生活,购物
当在文章里头出现这些关键字,就把它加亮显示..
文章是生成静态页面的,而这些关键字是能随时更新的,所以我想用JS来实现...
不知道怎样来实现这样的功能啊?特此求助
复制代码
代码如下:
script
language="JavaScript"
function
highlight(key)
{
var
key
=
key.split('|');
for
(var
i=0;
ikey.length;
i++)
{
var
rng
=
document.body.createTextRange();
while
(rng.findText(key[i]))
//rng.pasteHTML(rng.text.fontcolor('red'));
rng.pasteHTML('div
style="border:1
solid
red;display:inline"a
href="#"
title="+
rng.text
+"'
+
rng.text
+
'/a/div');
}
}
highlight('文章|关键|功能')
/script
求一段JS代码,要求搜索当前页面,如果发现当前页面中有设定的字符,就给出提示
html
script
function searchWords() {
var words = document.getElementById('search').value;
if (words != '') {
var innerHTML = document.body.innerHTML;
if (innerHTML.indexOf(words) != -1) {
alert('找到了');
if (words == '123') {
alert('123不作操作');
} else if (words == '456') {
alert('456跳转页面');
window.location.href = '';
} else if (words == '567') {
alert('567替换内容');
document.body.innerHTML = innerHTML.replace(new RegExp(/(567)/g),'789');
}
}
}
}
/script
body
div123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ/div
divinput id='search' type='text' placeholder='请输入查询字符' /button onclick='searchWords();'查询/button/div
/body
/html
如何查看网页的JS代码
浏览器查看。
用Chrome、火狐等(其它浏览器操作类同),打开浏览器后,按F12。或者打开开发者工具,可以查看相应的html、css、js等内容。
效果图如下(查看源码)