How to cut text by adding ... at the end, and on hover display the full text in the popup message?

Question

JavaScript

How to cut text by adding ... at the end, and when you hover over the text, display the full text in the popup message (if the text is cut off)? The text is a lot of lines.
Site on React js.

Answer 1

If not necessarily by words, then you can use styles

div.text {
   width: 200px;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

How to make a hint on the Internet a huge number of examples