如果 div 内容很长，则 HTML 显示按钮答案

【问题标题】：HTML if div content is long show button如果 div 内容很长，则 HTML 显示按钮
【发布时间】：2021-04-29 19:49:31
【问题描述】：

我有这个 django 应用程序，它是一个博客应用程序。博客很长，所以如果博客很长，我希望能够显示一些然后更多的 div 文本。这是我的html：

<a style="text-decoration: none;color: #000;" href="{%  url 'post-detail' post.id  %}">
   <div id="content-blog"><p class="article-content">{{ post.content|safe }}</p></div>
</a>

我想要这样的东西：

<script>
content = document.getElementById("content-blog");
max_length = 1000 //characters
if(content > max_length){
//Do something
}
</script>

那么我该如何让它真正发挥作用。总而言之，我希望它检查一个 div 是否超过 1000 个字符，如果是，则运行上面的 if 语句。谢谢。

【问题讨论】：

标签： javascript html django if-statement counter

【解决方案1】：

您需要使用innerText，请将您的JS代码更改为

<script>

var content=document.getElementById("content-blog").innerText.length;

max_length = 1000 //characters
if(content > max_length){
//Do something
}
</script>

【讨论】：

【解决方案2】：

获取所有博客并对它们进行处理：

let blogs = Array.prototype.slice.call(document.getElementsByClassName("article-content"));

blogs.forEach(blog => 
    if (blog.innerText.length > 1000) {

// Do stuff with the blog

    } else {}
)

您还可以修改视图中的上下文，或将模型属性添加到您的博客模式，为博客帖子创建一个preview_text。为帖子的前 100 个字符点赞 post.content[:100]。

【讨论】：