Skip to content

段落空两行

假设详情的 class 为 .detail-content

html
<hlx-template
  component-type="news"
  component-query-option="{'newsId':''}"
  component-variable="article"
></hlx-template>

<div class="detail-content" th:utext="${article.content}"></div>

ts 代码为:

ts
window.addEventListener("DOMContentLoaded", function () {
  const detailContentDom = document.querySelector(".detail-content");
  if (!detailContentDom) {
    return console.error("detail-content 元素不存在");
  }

  const hlxCkContentDom = detailContentDom.querySelector(".ck-content");
  if (!hlxCkContentDom) {
    return console.error("华龙芯 ck-content 元素不存在");
  }

  const pElementList = hlxCkContentDom.querySelectorAll("p");

  pElementList.forEach((item) => {
    // center 与 right 不需要缩进
    const alignNotNeedIndent = ["center", "right"].findIndex(
      (align) => align === item.style.textAlign
    );

    if (alignNotNeedIndent !== -1) {
      return;
    }

    if (!item.style.textIndent) {
      // if (!item.style.length) {
      item.style.textIndent = "2em";
    }
  });
});