Javascript 对每个容器中的文本进行切片

对于在座的大多数人来说，这个问题非常简单。我有下一个HTML代码：

<div class="content" id="content">
    <div class="container" id="container">
        <h1>Title</h1>
        <img class="post-img" src="#">
        <p class="text" id="text">Lorem500</p>
        <div class="button"></div>    
    </div>
    <hr>
    <div class="container" id="container">
        <h1>Title</h1>
        <img class="post-img" src="#">
        <p class="text" id="text">Lorem500</p>
        <div class="button"></div>    
    </div>
    <hr>
</div>

这可能看起来很愚蠢，但我尝试过不同的方法，这是我最后一次尝试

希望你的帮助。谢谢你抽出时间。非常感谢。

您不应该为此使用循环或循环。这样做将导致一个永无止境的循环，因为内容长度将始终结束

你需要做的是说内容大小超过了

300

在您的情况下，您将使用

content.length>300

和

content.substring（0300）

尝试以下操作：

var content = document.getElementById('content');
for(var i=0;i<$('.text').length;i++){
  var el = $('.text')[i];
  if(el.innerHTML.length>300){
    el.innerHTML = el.innerHTML.slice(0, 300) + " ...";
  }
}

var content=document.getElementById（'content'）；
对于（变量i=0；i300）{
el.innerHTML=el.innerHTML.slice（0300）+“…”；
}
}

问题是什么？

var content = "Hello this is some longer text to be cut shorter";
var displayText = ""; // The shorter version of the content

if(content.length > 5) {
    displayText = content.substring(0, 5);
} else {
    // The next is shorter then 5 so just display the text
}

console.log(displayText) // Output: Hello

var content = document.getElementById('content');
for(var i=0;i<$('.text').length;i++){
  var el = $('.text')[i];
  if(el.innerHTML.length>300){
    el.innerHTML = el.innerHTML.slice(0, 300) + " ...";
  }
}