Добавить класс для элемента
 

Добрый день!

У меня есть функция, которая ищет и заменяет данные, в выделенном тексте. Выгладит вот так:

function edit_shortcode_caption() {
  var textarea = document.getElementById('content'),
  txval = textarea.value;

  var selStart = textarea.selectionStart, 
  selEnd = textarea.selectionEnd;

  var slection = txval.substring(selStart, selEnd);

  if( slection ) {
    var replaced = slection

    .replace(/\t/gm, "  ");

    textarea.value = txval.substring(0, selStart) + replaced + txval.substring(selEnd, txval.length);
    selEnd = selStart + replaced.length;
  }

  textarea.setSelectionRange(selStart, selEnd);
}

Как мне её можно переделать, чтобы она добавляла класс .foo (если его нет), к выделенному элементу <tag>?

В смысле .foo? может быть class="foo", или ты хочешь прямо в поле ввода стили увидеть?

Ну конечно class="foo".

<tag class="foo"> - если вообще никакого класса у тега небыло;
<tag class="bar foo"> - если какой-нибудь класс был.

Еще раз, тебе нужен класс элемента, или блин текст в тексте? Какого "не было класса" у текста, который юзер еще набирает? Нет там никаких классов кроме тех, которые в цсс для поля кто-то прописал.

Чтобы проверить есть такой текст в выделенном фрагменте или нет, надо просто сделать range.indexOf('class="foo"');

Это функция, для админ панели. Нужно выделить тег и нажать на кнопку, только тогда она сработает. Она используется для размещения текста. Поэтому мне просто нужно добавить ТЕКСТОМ класс в ВЫДЕЛЕННЫЙ тег. Я могу сделать это с помощью регулярки, конечно, что-то вроде:

.replace(/\(<(.*?)( )?)?(class\=\"(.*?)\")?((.*?)?\>)?/gm, "$1class\=\"$5 foo\"\>");

Но, мне подумалось, что в JavaScript это можно сделать, как-нибудь изящнее. Я ещё не вполне его выучил, поэтому и прошу помощи. Напишите, пожалуйста, функцию...

element.className="foo"; тебя устроит? Так добавляются классы к тегам, а ты хочешь вставить текст в кусок текста в большом тексте, где кроме текста ничего нет. Вообще посрать что именно ты хочешь вставить и что на что заменить - класс, автоваз, алюминиевый таз поменять на чугунную сковородку - это все буквы и тексты и твой "класс" блин оленевод - просто текст. То есть твое ТЗ формулируется так: к тексту <tag> надо добавить текст class="foo" между символами буквы и косой вправо.

Ну вот, я за тебя ТЗ написал, теперь все получится.

ЗЫ скачай какой-нить markdown/parsedown/slimdown которые дауны давным давно написали специально для таких вещей. Настроишь его рулезы под свои нужды и не надо будет даунские кнопки давить и операторов мучить. Она просто напишет скажем [Звоните нам:красивая_ссылка](/callback) и маркдаун все сам нарисует. Там есть опупенные дауны, ты же видел http://stackoverflow.com/ - там все на маркдауне, на википедии маркдаун, а ты кнопки давишь. Деревня. )))

if(range.indexOf(' class="foo">')==-1) range=range.replace('>',' class="foo">');

Изящнее некуда и все в четком соответствии с оригинальным ТЗ


Фундаментальная проблема твоя в том, что без WYSWYG вся эта работа сводится к бесконечному ковырянию буковок, которые тупой юзер тут же стирает, набивает вновь, херачит пробелы как попало, скобки где хочет и хер ему чего объяснишь ибо если ты не знаешь html, то пиши в ворде, а потом экспортируй.

Ну и в каком-то смысле rich text editor есть готовый на js. Могучая хрень, с плагинами всякими.

Забыл объяснить в чем цимес маркдаунов. У них нет атрибутов, то есть там квази-атрибуты, с которыми если не человек, то машина справляется в тексте легче, чем с этой хератой типа <tag class="foo bar nah zah" id="one-two-33" onclick="{this.chenit.pokazat;}" selected>А вель хтмл это <span>дерево</small></tag> и надо контролировать все закрывашки.