React 拼接标签转换为HTML

最新推荐文章于 2025-02-05 17:44:55 发布

南国以南i

最新推荐文章于 2025-02-05 17:44:55 发布

阅读量514

点赞数 6

CC 4.0 BY-SA版权

文章标签： react.js

本文链接：https://blog.youkuaiyun.com/springhub/article/details/133681362

本文介绍了在JavaScript中处理字符串时遇到混杂字符和HTML标签的情况，重点讲解了如何使用`dangerouslySetInnerHTML`属性来安全地将包含标签的字符串转化为HTML。作者南国以南i强调了代码示例中的`<hr>`分隔符和`<sup>`上标符号的应用。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

提示：文章写完后，目录可以自动生成，如何生成可参考右边的帮助文档

文章目录

前言
在JS中混杂字符和HTML标签，识别方法：
总结

前言

请各大网友尊重本人原创知识分享，谨记本人博客：南国以南i、

提示：以下是本篇文章正文内容，下面案例可供参考

在JS中混杂字符和HTML标签，识别方法：

const menuList = ['门店', '星享俱乐部', '菜单', '<hr></hr>', '星巴克移动应用', '星礼卡', '星巴克臻选<sup>TM</sup>', '咖啡星讲堂', '上海烘培工坊', '关于星巴克', '帮助中心', '<hr></hr>'];

const listItems = menuList.map((item,index) =><li key={index} dangerouslySetInnerHTML={{ __html: item }}></li>);

// dangerouslySetInnerHTML：将JS中的标签转化为HTML语言，<hr>是分隔符,<sup>是上标