Является ли .find () быстрее, чем основной метод выбора потомков?

Слайд 30 в блоге Пола Айриша упоминал:

$ ('# container'). Find ('div.robotarm') быстрее, чем $ ('# container div.robotarm' Я хочу выделить (изменить фон или цвет текста) для каждого # {ключевого слова} и # {дополнительных ключевых слов} в тексте. Ключевое слово может только ...

Мне нужна простая подсветка синтаксиса в реальном времени в редакторе tinyMce. Я хочу выделить (изменить фон или цвет текста) для каждого # {ключевого слова} и # {дополнительных ключевых слов} в тексте. Ключевое слово может содержать только буквы, цифры и точки (.). Я не знаю, хороша ли моя идея:

  • привязать к событию onChange редактора
  • удалить все вхождения # {ключевое слово} span> (регулярное выражение)
  • найти все # {ключевое слово} и заменить их на # {найдено ключевое слово}

(для кода класса [1165236 css]

фон будет иметь какой-либо цвет)

Любые идеи, как решить эта проблема?

1
задан Alan Moore 10 August 2010 в 07:10
поделиться

1 ответ

Привязка к событию onChange кажется нормальным, но вам также следует рассмотреть возможность использования событий onKey ---. Я надеюсь, что следующий фрагмент кода будет вам полезен:

css (будет определено в content_css, т.е.):

[current] {
background-color:yellow;
}
[changed] {
background-color:green;
}

js helpfunctions:

var select_current = function(node){
  unselect_current();
  node.setAttribute('current','true');
};

var unselect_current = function(){
  var n = ed.getBody().firstChild;
  while (n){
    if (n.nodeType == 1 && n.getAttribute('current'))
    {
      n.removeAttribute('current');
    }
    n = n.nextSibling;
  }
};

p_of = function(node) // returns p-Element of node
{
  while (node){
  if (node.nodeName == 'BODY') { return null; }
  if (node.nodeName == 'P')    { return node; }
    else { node = node.parentNode; }                    
  }
  return null;
}

при вызове события:

var _node_changing = false;
console.log('onNodeChange: ', arguments);
if (!_node_changing && element.getAttribute('_mce_type') != 'bookmark'){
  _node_changing = true;
  var p = p_of(element);
  if (p){
    if (!p.getAttribute('current')){
    select_current(p);
    }               
  }
  _node_changing = false;
}
2
ответ дан 2 September 2019 в 22:22
поделиться
Другие вопросы по тегам:

Похожие вопросы: