javascript - 如何用span包裹引用的文本？

Question

我有一个问题，如何添加<span style="color: blue">将文本放在引号中。

示例:

.. and he said "Hello, I am Nick"

使用正则表达式我想达到这个结果:

.. and he said <span style="color: blue>"Hello, I am Nick"</span>

我想知道如何使用正则表达式来做到这一点。目标是仅将颜色应用于引号内的文本。

Answer 1

使用.replaceWith()函数，您可以在任何带引号的文本之间添加span标签。

$(document).ready(function() {
    $("h2"). // all p tags
contents(). // select the actual contents of the tags 
filter(function(i,el){   return el.nodeType === 3; }). // only the text nodes
each(function(i, el){ 
    var $el = $(el); // take the text node as a jQuery element
    var replaced = $el.text().replace(/"(.*?)"/g,'<span class="smallcaps">"$1"</span>') // wrap
    $el.replaceWith(replaced); // and replace
    });
  
});

.smallcaps {
    color:blue;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<h2>and he said "Hello, i am Nick" and "I am good"</h2>