【问题标题】:Replace different words in the same structure with jQuery用jQuery替换相同结构中的不同单词
【发布时间】:2016-07-11 23:33:47
【问题描述】:

我在这里找到了一个用 jQuery 替换单个单词的解决方案。该解决方案通常对我有用,但可以缩短一点吗?这是代码:

$(document).ready(function() {
    $('.who').text(function(i, oldText) {
        return oldText === 'Dritter' ? 'Ich nehm die Nummer drei' : oldText;
    });
    $('.who').text(function(i, oldText) {
        return oldText === 'Fünfter' ? 'Ich nehm die Nummer 5' : oldText;
    });
    $('.groupheader').text(function(i, oldText) {
        return oldText === 'Sechster' ? 'i am number six' : oldText;
    });
});    

对于这个div 结构:

<div class="who">Erster</div>
<div class="who">Zweiter</div>
<div class="who">Dritter</div>
<div class="who">Vierter</div>
<div class="who">Fünfter</div>
<div class="who">Sechster</div>

【问题讨论】:

    标签: javascript jquery text replace word


    【解决方案1】:

    您也可以使用三元运算符以这种方式缩短代码。

    代码 sn-ps:

    $(document).ready(function() {
      $('.who,.groupheader').text(function(i, oldText) {
        return oldText === 'Dritter' ? 'Ich nehm die Nummer drei' : oldText === 'Fünfter' ? 'Ich nehm die Nummer 5' : oldText === 'Sechster' ? 'i am number six' : oldText;
      });
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <div class="who">Erster</div>
    <div class="who">Zweiter</div>
    <div class="who">Dritter</div>
    <div class="who">Vierter</div>
    <div class="who">Fünfter</div>
    <div class="who">Sechster</div>

    FIDDLE DEMO

    【讨论】:

      【解决方案2】:

      您可以通过将所有替换项放在一个对象中来缩短此时间,并以要更改的文本为键。然后,您可以使用单行函数将文本替换为对象中的值(如果找到的话)。

      var substitutions = {
          'Dritter': 'Ich nehm die Nummer drei',
          'Fünfter': 'Ich nehm die Nummer 5',
          'Sechster': 'i am number six'
      }
      
      $('.who, .groupheader').text(function(i, oldText) {
          return substitutions[oldText] || oldText;
      });
      

      Working example

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 2013-10-13
        • 2014-06-03
        • 2017-10-07
        • 1970-01-01
        • 1970-01-01
        • 2019-11-15
        • 1970-01-01
        • 2014-01-18
        相关资源
        最近更新 更多