我们如何调用滑块段落的每个id，它改变每秒钟并限制它们的长度？

Question

我需要通过调用id来限制滑块段落上的文本，这些文本是从数据库调用的。我使用symphony框架，其中每个滑块包含不同的段落。

我只能限制第一个滑块段落中的一个，但所有段落中的其余部分都是全文。

<p id="slider-p">{{ property.description }} </p>

function ellipsify (str) {
     if (str.length > 100) {
         return (str.substring(0, 100) + "...");
     }
    else {
         return str;
     }

};
    var div = document.getElementById('slider-p');
    div.textContent = ellipsify(div.textContent);

结果只适用于第一个滑块段落包含有限制的文本。我想所有的滑块与限制包含或文字。

Answer 1

我想你的身份不是独一无二的。id属性对于文档必须是唯一的。如果有多个要更改的段落，最好使用class属性：

<p class="slider-p">{{ property.description }}</p>
<script>
var divs = document.getElementsByClassName('slider-p');
for(i=0; i<divs.length; i++)
{
    divs[i].textContent = ellipsify(divs[i].textContent);
}
</script>

但是..。对您来说，使用CSS文本溢出属性不是更容易吗？而不必为文本的像素长度而挣扎。

p.slider-p {
  white-space: nowrap; 
  overflow: hidden;
  text-overflow: ellipsis;
}