用其中的URL替换所有自定义标记的出现[JS]

时间:2016-12-31 22:02:25

标签: javascript html

我正在为我正在构建的网站制作一个在线文本编辑器,并且我使用自定义标记进行标记。 为了便于阅读,标记以蓝色突出显示,我使用以下功能购买:

   var imgOccurences = (informationText.match(/\[img/gi)).length;

   for(var i = 0; i < imgOccurences; i++){
      var imgLocation = informationText.indexOf('[img');
      var endImgLocation = informationText.indexOf(']', imgLocation+1);

      if(imgLocation != -1 && endImgLocation != -1){
         var informationTextTemp1 = informationText.slice(0, imgLocation);
         var informationTextTemp2 = informationText.slice(endImgLocation+1, -1);
         var informationTextTemp3 = informationText.slice(imgLocation, endImgLocation+1);

         informationTextTemp3 = "<span class='highlightWord'>"+informationTextTemp3+"</span>";
         informationText = informationTextTemp1 + informationTextTemp3 + informationTextTemp2;
      }
   }

然而,我面临的问题是,在将文本规范化为HTML时,我无法在[img]标记上使用正则表达式表达式(我之前使用的其他标记)事实上,我想突出显示图像标记及其所有内容,其中包括一个URL。

所以我决定计算[img]标签的'[img'部分的所有出现次数,然后查找下一次出现的']',然后将其从普通文本中切出,然后突出显示使用span,然后将其添加回普通文本,同时我将其放入for循环中。 但是只突出显示[img]标签的第一次出现,我不确定如何处理这个问题。任何帮助将不胜感激。

基本上我需要获得以下所有内容: [img src='www.example.com/image.png'] 并使其显示如下: <span class='highlightWord'>[img src='example.com/image.png']</span> 然后将其放入进入名为.innerHTML的div的textHighlights

预期结果: 1

我得到的结果: 2]

1 个答案:

答案 0 :(得分:1)

您可以更简单地执行此操作,因为Json#fromJson()方法接受正则表达式作为匹配字符串的参数。

.replace

以上内容将直接替换所有匹配项(将其包装在您想要的informationText = informationText.replace(/(\[img.+?\])/gi, '<span class="highlightWord">$1</span>');