我正在创建一个显示更多/更少的传记功能,需要创建一个截断预览版本,而不打破HTML。
**条件:**biography元素的innerHTML可能包含div、paragraph、span或根本没有HTML。标记也可能具有内联样式。传统的str.substring(0, 400)
如果碰巧拆分了任何类型的开始和结束标记,就会破坏页面。
避免孤立标记的最佳方法是什么?
const elm = document.getElementById("bio");
let fullHtml = elm.innerHTML;
let prevHtml;
prevHtml = fullHtml.substr(0, 450);
prevHtml = prevHtml.substr(0, Math.min(prevHtml.length, prevHtml.lastIndexOf(" "))); // truncates at last space to prevent mid-word truncation
// how do I make sure prevHtml doesn't have create orphaned tags?
1条答案
按热度按时间3npbholx1#
您可以显示和隐藏内容,而不是删除内容和破坏HTML。这里有一个浮动div的布局,它有一个固定的高度50px和一个按钮来切换全文的打开和关闭。(有一个z索引的问题,我不知道如何解决,如果你知道如何解决,请帮助解决它。)