javascript - HTML if div content is long show button

Question

I have this django app I made, and it is a blog app. The blogs are quite long, so I want to be able to show a little and then more of the div's text if the blog is long. Here is my 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>

I want something like this:

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

So how would I get this to actually work. To summarize, I want this to check if a div is longer than 1000 characters, and if it is, to run the if statement above. Thanks.

question from:https://stackoverflow.com/questions/65894385/html-if-div-content-is-long-show-button

Answer 1

You need to use innerText, please change your JS code to

<script>

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

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