iOS 开发

IOS UIWebView 高亮显示打开网页中的关键字

2016-06-28  本文已影响428人  docC2Y

(js代码参考网上案列)

#创建一个test.js文件 里面就是查找并高亮显示keyWord。(不懂得话就忽略掉,亲测可行)

varMyApp_SearchResultCount =0;

functionMyApp_HighlightAllOccurencesOfStringForElement(element,keyword) {

if(element) {

if(element.nodeType ==3) {// Text node

while(true) {

varvalue = element.nodeValue;// Search for keyword in text node

varidx = value.toLowerCase().indexOf(keyword);

if(idx <0)break;// not found, abort

varspan = document.createElement("span");

vartext = document.createTextNode(value.substr(idx,keyword.length));

span.appendChild(text);

span.setAttribute("class","MyAppHighlight");

span.style.backgroundColor="red";

span.style.color="black";

text = document.createTextNode(value.substr(idx+keyword.length));

element.deleteData(idx, value.length - idx);

varnext = element.nextSibling;

element.parentNode.insertBefore(span, next);

element.parentNode.insertBefore(text, next);

element = text;

MyApp_SearchResultCount++;// update the counter

}

}elseif(element.nodeType ==1) {// Element node

if(element.style.display !="none"&& element.nodeName.toLowerCase() !='select') {

for(vari=element.childNodes.length-1; i>=0; i--) {

MyApp_HighlightAllOccurencesOfStringForElement(element.childNodes[i],keyword);

}

}

}

}

}

functionMyApp_HighlightAllOccurencesOfString(keyword) {

MyApp_RemoveAllHighlights();

MyApp_HighlightAllOccurencesOfStringForElement(document.body, keyword.toLowerCase());

}

functionMyApp_RemoveAllHighlightsForElement(element) {

if(element) {

if(element.nodeType ==1) {

if(element.getAttribute("class") =="MyAppHighlight") {

vartext = element.removeChild(element.firstChild);

element.parentNode.insertBefore(text,element);

element.parentNode.removeChild(element);

returntrue;

}else{

varnormalize =false;

for(vari=element.childNodes.length-1; i>=0; i--) {

if(MyApp_RemoveAllHighlightsForElement(element.childNodes[i])) {

normalize =true;

}

}

if(normalize) {

element.normalize();

}

}

}

}

returnfalse;

}

// the main entry point to remove the highlights

functionMyApp_RemoveAllHighlights() {

MyApp_SearchResultCount =0;

MyApp_RemoveAllHighlightsForElement(document.body);

}

直接用Baidu首页来测试,这里我用的是storyBoard上直接放置一个webview

效果如下:

~ ~

希望可以帮到你。

best wishes

上一篇 下一篇

猜你喜欢

热点阅读