Использование Javascript для скрытия слов в строке

Question

У меня есть предложение, которое я хотел бы скрыть слова с помощью Javascript. Например, скрывая первое и шестое слово или что-то в этом роде. Исходя из фона PHP, я предполагаю, что это будет похоже на это.

1. У вас есть DIV с предложением в нем.
2. Вы получаете значение DIV (текстовое предложение).
3. Вы разделили текст пробелами «», чтобы получить каждое слово.
4. Затем вы окружаете каждое слово с помощью SPAN и id или класса.
5. Вы помещаете все слова с пролетами вокруг них обратно в DIV.
6. После взаимодействия с пользователем (или события таймаута) вы можете скрыть каждый SPAN [текст] SPAN по мере необходимости.

Это правильный способ справиться с этим?

Answer 1

Я бы сделал это точно так, как вы описали. Фактически, я действительно сделал:

<div> 
The dog jumps over the log. 
</div> 
<script type="text/javascript"> 
function boxWords(textNode) { 
    var frag = document.createDocumentFragment(), 
     // trim leading and trailing whitespace to avoid empty elements 
     words = textNode.nodeValue.replace(/(^\s+)|(\s+$)/g, '').split(' '); 

    for(var i = 0, len = words.length; i < len; ++i) { 
     frag.appendChild(document.createElement('span').appendChild(
      document.createTextNode(words[i])).parentNode); 
     frag.appendChild(document.createTextNode(' ')); 
    } 

    textNode.parentNode.replaceChild(frag, textNode); 
} 

var div = document.getElementsByTagName('div')[0]; 
boxWords(div.firstChild); 

// underline the 4th word 
div.getElementsByTagName('span')[3].style.textDecoration = 'underline'; 
</script> 

Answer 2

Я не уверен, какие цели шаги 4-> 6 служить? Если на шаге 3 вы получили разделенные слова, вы можете сохранить этот массив и всегда иметь доступ к соответствующему слову, когда вам нужно что-то сделать с ним.

Ваш путь вам еще предстоит выяснить, какой span/id/class нужно испортить, когда вы хотите что-то сделать. Вы по существу создавая ту же самую проблему yourlsef в другом формате,

Answer 3

Я думаю, что общая идея имеет смысл да ...

Получить innerhtml из DIV .. разбить его на «», а затем для каждое слово в значении помещает его в div с уникальным идентификатором ... вы можете сохранить относительный размер слова в пространстве, сделав невидимым, или вы можете свернуть предложение, сделав innerhtml = "".

function divclick(id) 
{ 
    //document.getElementById(id).style.visibility="hidden"; 
     // OR 
    //document.getElementById(id).innerHTML = ""; 
} 

Что касается получения раскола Див и повторно отображается в свои дивы отдельное слово ..., что не должно быть большое дело ... только думаю, что вы должны принять во внимание то, что события заставляя слова исчезать или появляться.