如何用 .each 替换标签内容

Question

我想编写一个脚本来调整标签长度，如果它超过 30 个字符，但找不到它保持不变的原因。小提琴： http://jsfiddle.net/rokas_m/9g3bcamz/10/

HTML:

<label>labelislabelislabelislabelislabelislabelislabelis</label><Br/>
<label>kitaskitaskitaskitaskitaskitaskitaskitaskitaskitaskitas</label><br/>
<label>asdfasdfsadfasdfsdfdsftaskitaskitaskitas</label><br/>

<label>siaip</label><br />
<label>siaip</label><br />
<label>siaip</label><br />

jQuery:

$('label').each( function(){ 
    var string = $(this).text();
    var ilgis = $(this).text().length;
   if (ilgis > 30){
   var string = string.substr(0,17)+'...';
     $( 'label' ).innerHTML = string;
        console.log(string);
   }

}
);

Answer 1

将 $( 'label' ).innerHTML = string; 替换为 $(this).html(string);。

修改后的代码如下：

$('label').each( function(){ 
    var string = $(this).text();
    var ilgis = $(this).text().length;
    if (ilgis > 30){
      var string = string.substr(0,17)+'...';
      $(this).html(string);
    }
   }
);

Answer 2

您可以使用 .text() 设置值，方法是传递一个回调函数作为其参数，每个标签都会被调用，例如

$('label').text(function(i, text) {
  return text.length > 30 ? text.substr(0, 17) + '...' : text;
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label>labelislabelislabelislabelislabelislabelislabelis</label><Br/>
<label>kitaskitaskitaskitaskitaskitaskitaskitaskitaskitaskitas</label><br/>
<label>asdfasdfsadfasdfsdfdsftaskitaskitaskitas</label><br/>

<label>siaip</label><br />
<label>siaip</label><br />
<label>siaip</label><br />

或者

$('label').each(function() {
  var string = $(this).text();
  var ilgis = string.length; //reuse the variable
  if (ilgis > 30) {
    string = string.substr(0, 17) + '...';
    $(this).html(string);//$(...) returns a jQuery object so don't have `innerHTML` property, also you need to target the current `label` not all of them
    //or just
    //this.innerHTML = string
    console.log(string);
  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<label>labelislabelislabelislabelislabelislabelislabelis</label><Br/>
<label>kitaskitaskitaskitaskitaskitaskitaskitaskitaskitaskitas</label><br/>
<label>asdfasdfsadfasdfsdfdsftaskitaskitaskitas</label><br/>

<label>siaip</label><br />
<label>siaip</label><br />
<label>siaip</label><br />

Answer 3

参考这个

$('label').each( function(){ 
    var string = $(this).text();
    var ilgis = $(this).text().length;
   if (ilgis > 30){
   var string = string.substr(0,17)+'...';
     jQuery(this).html(string);
        console.log(string);
   }

}
);

如何用 .each 替换标签内容

How to replace label content with .each

html

javascript

each

jquery

labels