接下来记一下实现原理:
首先先把上一次的查询结果清除掉,然后根据key的值,用正则表达式把区域内所有匹配的字符全都加上特殊的样式,比如方法中就全部加了一个类名为result的span标签,用odKey0变量记录key的值(下次再进入先比较如果一样的话说明是要看下一个或者上一个的内容,就不用在进入用正则表达式匹配了),oldCount0记录总共查询出来的个数,newflag置0(如果不是初次查询newflag为1)。
接着进入getNext方法,flg表示用户按下的是上一个还是下一个按钮,用index0记录当前查看的是哪一个匹配字符,与oldCount0比较,确定是递增或递减还是置0(如果大于oldCount0或者小于0,就要重新开始)。
focusMove方法就是使页面定位到当前元素的操作。
学到的jquery方法:
eq() 选择器:选择器选取带有指定 index 值的元素。例如:$(".contrast .result:eq(1)"),就是选择类名contrast元素中的第二个类名为result的元素。
parents()方法:元素的所有父元素。$("p").parents('.contrast-wrap'),p元素所有类名为contrast-wrap的元素。
replace()方法:用指定的html内容替换被选元素,注意是把被选元素的元素也替换掉。
offset()方法:返回或设置匹配元素相对于文档的偏移(位置)。
scrollTop()方法:返回或设置匹配元素的滚动条的垂直位置。
总结
以上所述是小编给大家介绍的html页面中完成查找功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对易采站长站网站的支持!









