javascript - 如何在 react-native 中删除空的 p 标签和 html

Question

我想从动态 html 内容中删除空的 p 标签和  。

下面是从 api 响应中检索到的 html 内容。空的 p 标签和   会创建不需要的空格。我想删除不需要的空格。

我正在使用 react-native-render-html 包来显示 html 内容。

expo sdk : 38 
react-native-render-html : ~1.9.0 
platform : Android,Ios

<p> </p>
<p> &nbsp </p>  

Answer 1

清理服务器中的输出会更好，但根据您的问题，您可以使用这样的 RegExp：

/<p>(\s|(&nbsp))*<\/p>/gmi

例子：

var string = "<p>  &nbsp   &nbsp  </p>";
var pattern = /<p>(\s|(&nbsp))*<\/p>/gmi;
var result = str.match(patt);

if(result) {
     console.log("Pattern matched. Do not add the string to the html.")
}

图案说明：

• 第一个<p>是普通的 p 元素字符。
• (\s|(&nbsp))*表示会有包含空格或   字符串的字符组。如果您发现那些零次或更多次，请匹配它们。
• final<\/p>是整理p元素。反斜杠出现在斜杠之前，因为普通的斜杠是 RegExp 中的特殊字符。所以我们用反斜杠转义它。

Answer 2

在react-native-render-html中有一个忽略标签的选项。

import { IGNORED_TAGS } from 'react-native-render-html/src/HTMLUtils';
...
 
// your props
ignoredTags={[ ...IGNORED_TAGS, 'tag1', 'tag2']}

Answer 3

使用此正则表达式删除 html 标签（除了 ）

const regEx = /(<([^>]+)>)/ig;
const tempResult = yourData.replace(regEx, '');

如果 html 响应包含 然后执行附加步骤：

const secondRegEx = /(( ))*/gmi;
const result = tempResult.replace(secondRegEx, '');