在javascript中查找并替换包含“(撇号)的字符串 出身背景

在javascript中查找并替换包含“(撇号)的字符串 出身背景,javascript,html,Javascript,Html,因此,我正在为我的tumblr编写一个表情脚本,这样当我写一篇文章并写下时,我会说:这看起来像是一张笑脸,但事实上,如果我编辑这篇文章,它仍然是一张: 我对javascript和这个论坛都是非常非常陌生的,但是我成功地制作了一个我真正理解的脚本!!我知道使用jquery这个方法可能会容易得多,猜测它是javascript的一个分支,但我已经研究过了,它太难理解了 问题 这个脚本运行得很好,直到我因为撇号而想替换:'or=.='。我到处寻找,努力让它工作,但是,唉,什么都想不出来。如果有人有什么想

因此,我正在为我的tumblr编写一个表情脚本,这样当我写一篇文章并写下时,我会说:这看起来像是一张笑脸,但事实上,如果我编辑这篇文章,它仍然是一张:

我对javascript和这个论坛都是非常非常陌生的,但是我成功地制作了一个我真正理解的脚本!!我知道使用jquery这个方法可能会容易得多,猜测它是javascript的一个分支,但我已经研究过了,它太难理解了

问题 这个脚本运行得很好,直到我因为撇号而想替换:'or=.='。我到处寻找,努力让它工作,但是,唉,什么都想不出来。如果有人有什么想法,我们将不胜感激

function getElementsByClass(node,searchClass,tag) {
    var classElements = new Array();
    var els = node.getElementsByTagName(tag);
    var elsLen = els.length;
    var pattern = new RegExp("\\b"+searchClass+"\\b");
    for (i = 0, j = 0; i < elsLen; i++) {
        if ( pattern.test(els[i].className) ) {
            classElements[j] = els[i];
            j++;
        }
    }
    return classElements;
}

function Smile() {

    var emoticons=new Array();
    emoticons[1]=" :)";
    emoticons[2]=" :D";
    emoticons[3]=" :(";
    emoticons[4]=" :'(";
    emoticons[5]=" XD";
    emoticons[6]=" :3";
    emoticons[7]=" :P";
    emoticons[8]=" ;)";
    emoticons[9]=" :S";
    emoticons[10]=" =.='";
    emoticons[11]=" o.O";
    emoticons[12]=" ^^";
    emoticons[13]=" :O";
    emoticons[14]=" =.=";

    var shortcuts=new Array();
    shortcuts[1]="http://static.tumblr.com/vyvljow/97bluwnkt/_.png";
    shortcuts[2]="http://static.tumblr.com/vyvljow/JNgluhdyn/d.png";
    shortcuts[3]="http://static.tumblr.com/vyvljow/Jaeluhq32/_.png";
    shortcuts[4]="http://static.tumblr.com/vyvljow/0mglujqan/__.png";
    shortcuts[5]="http://static.tumblr.com/vyvljow/JAkluhgto/xd.png";
    shortcuts[6]="http://static.tumblr.com/vyvljow/kEDluhdzu/3.png";
    shortcuts[7]="http://static.tumblr.com/vyvljow/UEnlug0o7/p.png";
    shortcuts[8]="http://static.tumblr.com/vyvljow/gkKlug0ow/wink.png";
    shortcuts[9]="http://static.tumblr.com/vyvljow/24iluhgu5/s.png";
    shortcuts[10]="http://static.tumblr.com/vyvljow/ieIluhp7m/__.png";
    shortcuts[11]="http://static.tumblr.com/vyvljow/oucluuvif/oo.png";
    shortcuts[12]="http://static.tumblr.com/vyvljow/blGluhwqw/__.png";
    shortcuts[13]="http://static.tumblr.com/vyvljow/ci0luwnbw/o.png";
    shortcuts[14]="http://static.tumblr.com/vyvljow/ieIluhp7m/__.png";

    var classes=new Array();
    classes[1]="body hasMarkup";
    classes[2]="caption hasMarkup";
    classes[3]="description hasMarkup";
    classes[4]="description";
    classes[5]="reply hasMarkup";
    classes[6]="caption";

    for (var counter = 1; counter < emoticons.length; counter++) {  
        var find = emoticons[counter];
        var repl = (' <img src="'+shortcuts[counter]+'">');
        for (var classcounter = 1; classcounter < classes.length; classcounter++) { 
            var myEls = getElementsByClass(document,classes[classcounter],'*');
            for ( v = 0; v < myEls.length; v++ ){
                var page = myEls[v].innerHTML;
                while (page.indexOf(find) >= 0) {
                    var i = page.indexOf(find);
                    var j = find.length;
                    page = page.substr(0,i) + repl + page.substr(i+j);
                    myEls[v].innerHTML = page;
                }                
            }
        }
    }
}
在现实生活中,代码看起来更整洁。请相信我。不知道如何在这个网站上很好地格式化它。提前感谢你的帮助

更新问题!! 事实上,不是代码出了故障,而是因为撇号不匹配。这是tumblr吐出的撇号,我无法更改:' 这是代码中的撇号:'

如果我试图在js代码中使用tumblr撇号,它会破坏一切。万劫不复。更不用说它不起作用了

那么,是否有一个适用于所有事物的全局撇号?或者全部替换。那种东西。最好不要破坏我的密码。再次感谢

谢谢你的回复。你们真是太棒了

更新2 我确实确定tumblr撇号的ascii代码为8217,而我的javascript代码为39 但是我不知道如何使用它来修改和兼容我的脚本

问题已经解决了!! 非常感谢所有回复和回复的人:
尤其是Adam Jurczyk。

当我尝试替换包含撇号的表情符号时,效果很好

演示:

关于代码的一些注释:

数组是从零开始的,但是您可以从索引1开始使用它们。 您可以使用文字数组语法初始化数组,而不是一次在数组中放入一个项。 可以使用push方法在getElementsByClass函数中将项添加到数组中。 每次替换之后,您都会将内容放回元素中,但应该在循环之后这样做。 您应该交换循环,以便在元素循环中包含表情符号循环,这样可以大大减少使用innerHTML的次数。 更新代码:

function getElementsByClass(node, searchClass, tag) {
  var classElements = [];
  var els = node.getElementsByTagName(tag);
  var elsLen = els.length;
  var pattern = new RegExp("\\b" + searchClass + "\\b");
  for (i = 0; i < elsLen; i++) {
    if (pattern.test(els[i].className)) {
      classElements.push(els[i]);
    }
  }
  return classElements;
}

function Smile() {
  var emoticons = [
    " :)",
    " :D",
    " :(",
    " :'(",
    " XD",
    " :3",
    " :P",
    " ;)",
    " :S",
    " =.='",
    " o.O",
    " ^^",
    " :O",
    " =.="
  ];
  var shortcuts = [
    "http://static.tumblr.com/vyvljow/97bluwnkt/_.png",
    "http://static.tumblr.com/vyvljow/JNgluhdyn/d.png",
    "http://static.tumblr.com/vyvljow/Jaeluhq32/_.png",
    "http://static.tumblr.com/vyvljow/0mglujqan/__.png",
    "http://static.tumblr.com/vyvljow/JAkluhgto/xd.png",
    "http://static.tumblr.com/vyvljow/kEDluhdzu/3.png",
    "http://static.tumblr.com/vyvljow/UEnlug0o7/p.png",
    "http://static.tumblr.com/vyvljow/gkKlug0ow/wink.png",
    "http://static.tumblr.com/vyvljow/24iluhgu5/s.png",
    "http://static.tumblr.com/vyvljow/ieIluhp7m/__.png",
    "http://static.tumblr.com/vyvljow/oucluuvif/oo.png",
    "http://static.tumblr.com/vyvljow/blGluhwqw/__.png",
    "http://static.tumblr.com/vyvljow/ci0luwnbw/o.png",
    "http://static.tumblr.com/vyvljow/ieIluhp7m/__.png"
  ];
  var classes = [
    "body hasMarkup",
    "caption hasMarkup",
    "description hasMarkup",
    "description",
    "reply hasMarkup",
    "caption"
  ];
  for (var classcounter = 0; classcounter < classes.length; classcounter++) {
    var myEls = getElementsByClass(document, classes[classcounter], '*');
    for (v = 0; v < myEls.length; v++) {
      var page = myEls[v].innerHTML;
      var replaced = false;
      for (var counter = 0; counter < emoticons.length; counter++) {
        var find = emoticons[counter];
        var j = find.length;
        var repl = ' <img src="' + shortcuts[counter] + '">';
        do {
          var i = page.indexOf(find);
          if (i != -1) {
            replaced = true;
            page = page.substr(0, i) + repl + page.substr(i + j);
          }
        } while (i != -1);
      }
      if (replaced) {
          myEls[v].innerHTML = page;
      }
    }
  }
}
也许更简单一些:


你知道吗,你可以使用数组文字?var emoticons=[:,:D,…]出现了什么问题?您的脚本对我来说工作得很好,并且没有问题:“or=。=”更好的是,对象哈希映射文本:var-emoticonMap={':':'http://static.tumblr.com/vyvljow/97bluwnkt/_.png',':D':'另一个url',…}@socha23,它只是跳过带撇号的那些,就像没有效果一样。@adam,是的,我知道。我更喜欢这种方法,因为它更容易对眼睛。XD@divad,不知道你在说什么。。。我猜地图是另一个我还没有学会的javascript函数。我会调查的。只是尝试了一下,它与撇号配合得很好。抱歉,没有看到答案:这是我上面的评论:它没有替换,因为撇号是不同的。我记得这种情况经常发生,尤其是在编码时,在复制意大利面之后,我总是需要替换撇号。因此,我复制了tumblr本身的撇号,并将其粘贴到表情符号数组中。我一这么做,它就破坏了我的密码。彻底摧毁了它。javascript不喜欢外来撇号。是否有一个全局撇号?一个对所有事物都有效的、通用的、跨平台的东西?因为我真的需要一个…也谢谢你的回答。我知道这是一个更有效的,但我不再明白发生了什么。。。被替换的布尔值实际上在做什么?我试着慢慢地理解它。XD!=意思是不等于权利?o、 这条线到底在干什么?page=page.substr0,i+repl+page.substri+j;再次感谢您的回复和耐心。非常感谢替换的booelan只跟踪页面中的值是否已更改,因此我们知道是否必须将其写回元素。innerHTML属性非常昂贵,因此尽可能减少使用是值得的。更改页面变量的行与原始代码中的行相同;它实际将表情文字(例如:P)替换为图像标签。同样,请参考上述注释。事实上,不是代码出了故障,而是因为撇号不匹配。这是tumblr吐出的撇号,我无法更改。”这是代码中的撇号。”如果我试图在js代码中使用tumblr撇号,它会破坏一切。万劫不复。更不用说它不起作用了。再次感谢您的回复。一
再次问我前面的问题,是否有一个全局撇号适用于所有事物?或者全部替换。那种东西。最好不要破坏我的密码。再次感谢哇。你的代码真的很简单。。。。不确定regexp是什么。但我需要将代码更改为只在特定的div类中工作。再次感谢你的回答,看看你能否回答前面评论中的问题。干杯上面的代码只是一个简单的函数——如何以及在何处获得输入取决于您:啊,我明白了。不确定什么是代码点,但我确定tumblr撇号有一个8217的ascii代码,而我的javascript代码使用39。我不知道如何使用它来修改和兼容我的脚本编辑帖子对于回复来说是一种糟糕的方式;]
var emots = {
    " :)" : "http://static.tumblr.com/vyvljow/97bluwnkt/_.png",
    " :D" : "https://static.tumblr.com/vyvljow/JNgluhdyn/d.png",
    " :(" : "http://static.tumblr.com/vyvljow/Jaeluhq32/_.png",
    " :'(" : "http://static.tumblr.com/vyvljow/0mglujqan/__.png",
    " XD" : "http://static.tumblr.com/vyvljow/JAkluhgto/xd.png",
    " :3" : "http://static.tumblr.com/vyvljow/kEDluhdzu/3.png",
    " :P" : "http://static.tumblr.com/vyvljow/UEnlug0o7/p.png",
    " ;)" : "http://static.tumblr.com/vyvljow/gkKlug0ow/wink.png",
    " :S" : "http://static.tumblr.com/vyvljow/24iluhgu5/s.png",
    " =.='" : "http://static.tumblr.com/vyvljow/ieIluhp7m/__.png",
    " o.O" : "http://static.tumblr.com/vyvljow/oucluuvif/oo.png",
    " ^^" : "http://static.tumblr.com/vyvljow/blGluhwqw/__.png",
    " :O" : "http://static.tumblr.com/vyvljow/ci0luwnbw/o.png",
    " =.=" : "http://static.tumblr.com/vyvljow/ieIluhp7m/__.png"
};

function smile(str){
    var out = str;
    for(k in emots){
        out = out.replace(k,'<img src="'+emots[k]+'"/>','g');
    }
    return out;
}
var emots = {
    //...
    " :\u2019(" : "http://static.tumblr.com/vyvljow/0mglujqan/__.png",