从Javascript中排除链接

时间:2017-07-20 04:35:21

标签: javascript jquery html

我想首先说我是非常非常新的javascript,并且基本上做了很多谷歌搜索找到这个地方和各种其他资源。虽然我发现一个脚本可以修改为我想要的东西(并设法使其工作),但它会干扰在指定div中创建的任何链接。有没有办法从javascript中排除链接,只是让javascript影响文本?

这是javascript。虽然我没有问题让第一部分工作(我替换引用的文本),我似乎无法排除具有html的链接和图像,其中包含引号。

$("div.gam-posttem div").each(function(){
    this.innerHTML = this.innerHTML.replace(/\"([^\"]+)\"/g, 
        '<div class="gam-quotetext">"$1"</div>');
});
$not('div.gam-posttem > div > a').each(function(){});

这是我正在使用的HTML。

<div class="gam-posttem"><div class="gam-posttem1">

"quote here" and regular text here. "more quote here"

<br><br><a href="http://www.google.com">Link is Here</a>

</div></div>

非常感谢任何帮助,如果您需要更多信息,例如CSS,请随时询问。

1 个答案:

答案 0 :(得分:0)

这使得特别棘手的是JavaScript正则表达式不允许使用后视。你想要做的是尝试匹配“在其之前有相同数量的&lt;和&gt;字符(在其他”字符之外)的对。即使你可以,这也是一个非常讨厌的正则表达式......

但是,您只关心&lt;&gt;之外的字符。对,使用正则表达式匹配(虽然不可取)是可能的: <(?:[^><\"\']*?(?:([\"\']).*?\1)?[^><\'\"]*?)+(?:>|$)将匹配所有&lt;&gt;对,忽略标签内引号内的近角括号。因此,您希望匹配这些标记之外的所有内容。

可能有更好的方法,但您可以尝试以下想法:

  1. 匹配所有标签
  2. 对于每个标签,获取起始位置和长度=&gt;计算结束位置
  3. 将字符串的起始索引添加到结束位置的前面
  4. 将字符串的长度添加到起始位置
  5. 对于每个(end,start)对(因为我们正在反转匹配),运行你的replace方法并修改字符串。
  6. String.prototype.spliceish = function(start, end, newSubStr) {
      return this.slice(0, start) + newSubStr + this.slice(end);
    };
    
    var tagMatch = /<(?:[^><\"\']*?(?:([\"\']).*?\1)?[^><\'\"]*?)+(?:>|$)/g;
    var tokenMatch = /\"([^\"]+)\"/g;
    
    function invertedMatch(htmlString) {
    	var returnString = htmlString;
    	var startIndexes = [],
      	lengths = [],
        match = tagMatch.exec(htmlString);
      while(match !== null)
      {
      	startIndexes.push(match.index);
        lengths.push(match[0].length);
        match = tagMatch.exec(htmlString);
      }
      
      var endIndexes = startIndexes.map(function(val, ix) { return val + lengths[ix]; });
      var invertedStarts = [0].concat(endIndexes); // we are inverting, so capture start text.
      var invertedEnds = startIndexes.concat(htmlString.length);
      
      // will need to go backwards
      for(var i = invertedStarts.length - 1; i >= 0; i--) {
      	var start = invertedStarts[i],
        	end = invertedEnds[i];
      	var stringReplace = htmlString.substring(start, end);
        returnString = returnString.spliceish(start, end, stringReplace.replace(tokenMatch,
        	'<div class="gam-quotetext">"$1"</div>'));
      };
      
      return returnString;
    }
    
    $("#root").html(invertedMatch($("#root").html()));
    .gam-quotetext{
      color: green
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div id="root">
      <div class="gam-posttem">
        <div class="gam-posttem1">
    
        "quote here" and regular text here. "more quote here"
    
        <br>
        <br>
        <a href="http://www.google.com">Link is Here</a>
    
        </div>
      </div>
    </div>