汇总：HTML 转换 Markdown 时需要根据元素的 white-space 属性来处理空白字符

背景

应该按网页的实际呈现方式来解析空白字符

涵盖两种场景：

• 网页剪藏 → 浏览器拓展 与 Lute 进行处理
• 从网页复制内容粘贴到思源 → Lute 前端 进行处理

规范：https://developer.mozilla.org/zh-CN/docs/Web/CSS/white-space

white-space 属性影响空白字符的处理方式，需要依据元素实际的 white-space 属性值分别处理的空白字符包含以下几种：

方案

1. 首先获取元素的 white-space 属性值

   • 网页剪藏 → 浏览器拓展可以通过 Window.getComputedStyle() 获取元素的样式，例如：

     const pElement = document.querySelector('p');
     const computedStyle = window.getComputedStyle(pElement);
     console.log(computedStyle.whiteSpace); // 返回实际应用的 white-space 值（包括继承）

   • 从网页复制内容粘贴到思源 → 在复制得到的 HTML 中，元素的所有样式都是内联样式，可以直接判断

2. 然后针对实际的 white-space 属性值分别处理元素中的空白字符

关联问题

• 网页摘录时对span元素white-space和word-wrap样式换行识别 #13195

  剪藏 span 元素换行问题 #13838

  剪藏知乎遇到链接会换行 #14400

  改进小红书剪藏 #14772 (comment)
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

@ruin1990