如何用JavaScript编写代码实现富文本框文本对齐的技巧？

本文共计1157个文字，预计阅读时间需要5分钟。

目录 + 需求： + 分析需求： + 1 如何获取选中的部分 + * 2 什么是块元素 + 3 什么是空元素 + 实现思路： + 代码实现： + 总结 + 需求： + 一个可编辑（contenteditable=true）的div，对选中内容进行操作

目录

• 需求：
• 分析需求：
• 1如何获取选中的部分 *
• 2什么是块元素
• 3末梢元素（没有子节点的元素）
• 实现思路：
• 代码实现:
• 总结

需求：

一个可编辑（contenteditable=true）的div，对齐选中内容,左、中，右 ，其实质是：对选中的末梢节点，找到块属性的父元素，设置text-algin:center:

MDN:text-alignCSS属性定义行内内容（例如文字）如何相对它的块父元素对齐。text-align并不控制块元素自己的对齐，只控制它的行内内容的对齐。