angular 代码高亮_angular 搜索/查找关键字高亮
該樓層疑似違規已被系統折疊?隱藏此樓查看此樓
/**
*Created by JUNHUI on 2016/11/21.
*/
/*
*參數說明:
*obj: 對象, 要進行高亮顯示的html標簽節點.
*hlWords: 字符串,要進行高亮的關鍵詞詞, 使用 豎杠(|)或空格分隔多個詞 .
*bgColor: 背景顏色,默認為紅色.
*/
(
function(){
'use strict';
angular.module('app')
.factory('HeightLight',function(){
function MarkHighLight(obj, hlWords, bgColor) {
hlWords = AnalyzeHighLightWords(hlWords);
if (obj == null || hlWords.length == 0)
return;
if (bgColor == null || bgColor == "") {
bgColor = "red";
}
MarkHighLightCore(obj, hlWords);
//執行高亮標記的核心方法
function MarkHighLightCore(obj, keyWords) {
var re = new RegExp(keyWords,"i");
var style = ' style="background-color:'+ bgColor + ';" '
for (var i = 0; i < obj.childNodes.length;i++) {
var childObj = obj.childNodes[i];
if (childObj.nodeType == 3) {
if (childObj.data.search(re)== -1) continue;
var reResult = newRegExp("(" + keyWords + ")", "gi");
var objResult =document.createElement("span");
objResult.innerHTML =childObj.data.replace(reResult, "$1");
if (childObj.data ==objResult.childNodes[0].innerHTML) continue;
obj.replaceChild(objResult,childObj);
} else if (childObj.nodeType == 1) {
MarkHighLightCore(childObj,keyWords);
}
}
}
var hlWordshlWords;
var resultresult;
//分析關鍵詞
function AnalyzeHighLightWords(hlWords) {
if (hlWords == null)
return "";
hlWordshlWords = hlWords.replace(/\s+/g,"|").replace(/\|+/g, "|");
hlWordshlWords = hlWords.replace(/(^\|*)|(\|*$)/g,"");
if (hlWords.length == 0) return"";
var wordsArr = hlWords.split("|");
if (wordsArr.length > 1) {
var resultArr = BubbleSort(wordsArr);
var result = "";
for (var i = 0; i
resultresult = result +"|" + resultArr[i];
}
returnresult.replace(/(^\|*)|(\|*$)/g, "");
} else {
return hlWords;
}
}
//利用冒泡排序法把長的關鍵詞放前面
function BubbleSort(arr) {
var temp, exchange;
for (var i = 0; i < arr.length; i++) {
exchange = false;
for (var j = arr.length - 2; j >=i; j--) {
if ((arr[j + 1].length) >(arr[j]).length) {
temp = arr[j + 1];arr[j + 1] = arr[j]; arr[j] = temp;
exchange = true;
}
}
if (!exchange) break;
}
return arr;
}
}
//end
function search() {
var obj =document.getElementById("waiDiv");
var keyWord =document.getElementById("keyWord");
MarkHighLight(obj, keyWord.value,"Orange");
}
return{
MarkHighLight:MarkHighLight
}
})
}
)();
總結
以上是生活随笔為你收集整理的angular 代码高亮_angular 搜索/查找关键字高亮的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 微粒贷借款流程
- 下一篇: cfnet用于嵌入式_做嵌入式驱动的,你