包裹一个跨度的字符串 [英] Wrapping strings with a span

问题描述

例如，我有一个可以内容的div中的文本，如下所示：

 < div id =board> ; 
< div>＃include< iostream.h>< / div> 
< div>< / div> 
< div> int main（）{< / div> 
< div> 
 clrscr 
< span id =openParen>（< / span> 
< span id =closeParen>）< / span> 
; 
< / div> 
< div> return 0;< / div> 
< div>}< / div> 
< / div> 
  

如果我看到一些关键字，它将被包装在 span 。

 < div id =board> 
< div>< span class =fragment>＃include< iostream.h>< / span>< / div> 
< div>< / div> 
< div> int< span class =fragment> main< / span>（）{< / div> 
< div> 
< span class =fragment> 
 clrscr 
< span id =openParen>（< / span> 
< span id =closeParen>）< / span> 
; 
< / span> 
< / div> 
< div> return 0;< / div> 
< div>}< / div> 
< / div> 
  

我完成了封装关键字，如#include和main，但我无法使用此代码来封装clrscr（） （来自 https://stackoverflow.com/users/2684660/funkwurm ）：

$每个（function（index，child））$ {
var text = $（child）.html（ ）;
text = text.replace（/（#include（\s *& lt;。*& gt））/ g，'< span class =frag> $ 1< ; / span>'）;
text = text.replace（/（main）/ g，'< span class =frag> $ 1< / span>'）;
text = text.replace（/（clrscr）/ gi，'< span class =frag> $ 1< / span>'）;
$（child）.html（text）;
} ）;

解决方案

jQuery版本（非CoffeeScript）工作 jsFiddle

  $（'＃board'）。children（）。each（function（index，child）{
 var text = $（child）.html（）; 
 text = text.replace（/ #include（\s *& lt;。*& gt））/ gi，'< span> $ 1< / span>'）; 
 text = text.replace（/ \（。* \））/ gi，'< span> $ 1< / span>'）; 
 $（child）.html（text）; 
}）; 
  

原来你不能使用 text（）像我在dcro的回答下提出的。

For instance, i have a text in my contenteditable div like this:

<div id = "board">
    <div>#include<iostream.h></div>
    <div></div>
    <div>int main(){</div>
    <div>
        clrscr
           <span id="openParen">(</span>
           <span id="closeParen">)</span>     
        ;   
    </div>
    <div>return 0;</div>
    <div>}</div>
</div>

If i saw some keywords, it would be wrap in span.

<div id = "board">
    <div><span class="fragment">#include<iostream.h></span></div>
    <div></div>
    <div>int <span class="fragment">main</span>(){</div>
    <div>
        <span class="fragment">
        clrscr
           <span id="openParen">(</span>
           <span id="closeParen">)</span>     
        ;
        </span>   
    </div>
    <div>return 0;</div>
    <div>}</div>
</div>

Im done wrapping keywords like #include and main but i am unable to wrap clrscr() using this code (from https://stackoverflow.com/users/2684660/funkwurm):

$('#board').children().each(function(index, child) {
   var text = $(child).html();
       text = text.replace(/(#include(\s*&lt;.*&gt;)?)/g, '<span class="frag">$1</span>');
       text = text.replace(/(main)/g, '<span class="frag">$1</span>');
       text = text.replace(/(clrscr)/gi, '<span class="frag">$1</span>');
       $(child).html(text);
});

解决方案

jQuery version (non CoffeeScript) working jsFiddle

$('#board').children().each(function(index, child) {
    var text = $(child).html();
    text = text.replace(/(#include(\s*&lt;.*&gt;)?)/gi, '<span>$1</span>');
    text = text.replace(/(main\(.*\))/gi, '<span>$1</span>');
    $(child).html(text);
});

Turns out you can't use text() like I suggested under dcro's answer.

这篇关于包裹一个跨度的字符串的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！