缄默蜀黍ONE
2016-04-06 01:49
已采纳
html>
页面查找不同标签的内容
body{
margin:20px;
}
.body{
width: 300px;
height: 200px;
background-color: #ddd;
}
p{
font-size: 20px;
line-height: 25px;
height: 25px;
}
.p_serchar{ /*定义被搜索到时的显示样式*/
background-color: blue;
color: #fff;
}
function search(){
//获取input标签对象(注意是对象不是内容)
var search_str = document.getElementById("search_str");
var is_search; //用于判断是否出现相同内容
alert("你将要搜索:"+search_str.value);
//循环遍历p标签的HTML内容
for (var i = 0; i
//获取第i个p标签对象
var p = document.getElementsByTagName("p")[i];
p.className="";//初始化,清除每次遍历后p标签的class值
if (p.innerHTML==search_str.value) {
p.className="p_serchar";
is_search = 1; //如果存在相同则记录为1
}
}
//在p标签遍历完后如果is_search=1,则证明存在有相同内容,否则输出警告
if(is_search!=1){
alert("你输入的内容并不在任何p标签中存在!");
}
is_search = 0;//对判断元素初始化
}
请输入关键内容:
你好
他好
我好
大家好
如上代码,你可以复制到外部编辑器运行,代码相关位置有详细解说,还不懂可以先看3-6控制类名那节。