채팅 상자에 키워드를 강조 표시하고 여러 키워드에 다른 스타일을 추가하는 방법은 무엇입니까?

Question

게임 사이트의 채팅 상자 안에 강조 표시 기능이있는 사용자 스크립트를 수정하고 있습니다. 나는 그것에 키워드와 다른 CSS 스타일을 추가 할 수 있도록 노력하고 있습니다. 나는 그룹에 키워드를 추가하는 것을 찾고 있는데, 그래서 나는 그 그룹에서 여러 키워드에 대해 하나의 스타일을 만들 수있다. 그리고 다른 그룹과 다른 스타일.

이는 배열을 사용하여 서로 다른 키워드에 CSS 스타일을 추가하는 간단한 방법이 있나요

http://i.imgur.com/7nbMuA4.png

dctools.checkForChatKeyword = function(elements) { 
    if (GM_getValue("dct-options-hiflags") != null) { 
     $(elements).highlight('flag') 

      .highlight('keyword 1') 
      .highlight('keyword 2') 
      .highlight('keyword 3') 
      .highlight('keyword 4') 
      .highlight('keyword 5') 
      .highlight('keyword 6') 
      .highlight('keyword 7'); 
    } 

과 같은 방법입니까?

Answer 1

(당신이 .highlight 기능 코드를 게재하지 않기 때문에) 일반, 당신 것 : 그런 다음

var 
    styleRedOnYellow = {"color": "red",  "background": "yellow"} 
    , styleWhiteOnBlack = {"color": "white", "background": "black"} 
    , styleLimeOnPink = {"color": "lime", "background": "pink"} 
    , stylePuke_1  = {"color": "#EEF272", "background": "#97CC9A"} 
; 

:

1. 같은 jQuery를 스타일 일련의 객체를 생성 연관 배열을 사용하여 키워드를 스타일과 연결할 수 있습니다. :

2. 88,그런 다음 .highlight 함수 내에서, 그것과 같이 포장 노드 뭔가에 스타일을 적용 할 수 있습니다 :

   /*--- keywordParameter is the variable inside highlight() that 
       contains the particular keyword for this function call. 
   */ 
   var styleToApply = stylePerKeyword[keywordParameter]; 
   if (styleToApply) { 
       /*-- wrappingNode is a jQuery around whatever highlight() 
        wraps a word in to highlight it with. Probably a <span>. 
       */ 
       wrappingNode.css (styleToApply); 
   } 
   else { 
       console.log (
        '*** Unknown keyword, "' + keywordParameter 
        + '", in .highlight()' 
       ); 
   }