从字符串中去除某些 HTML
Strip certain HTML from string
我正在使用 ngx-quill 和输入主体 returns 一些 HTML 元素。
例子
<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust
我想删除所有 HTML 标签，换行段落除外。
当 post 有多个行/中断时，ngx-quill 添加几个链式 <p></p><p></p>（见上文）
我尝试使用 replace 函数去除元素，但某些元素如 <u> 没有被去除。另外，如何将具有多个换行符的部分合并为一个换行符
我试过了
post = '<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops.""Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops."</em></strong></p>'
function stripElements(post: any) {
let newPost = post;
newPost = newPost.replace('<u>', '<span>');
newPost = newPost.replace('</u>', '</span>');
newPost = post.replace('<strong>','');
newPost = newPost.replace('</strong>', '');
newPost = newPost.replace('<em>', '');
newPost = newPost.replace('</em>', '');
newPost = newPost.replace('<p><br></p>', '<p></p>')
return newPost;
}
规则 #1：不要使用正则表达式操纵 HTML。请改用 DOM 解析器。
规则 #2：您可能不想为 DOM 解析器的开销烦恼，只想完成工作，并且可能会忽略规则 #1。
因此，如果您愿意，这样的事情可能会奏效：
return post.replace(/<\/?[a-z]+>/gi, m => m.toLowerCase() === '<br>' ? '<p></p>' : '');
我不太确定这就是你想要处理换行符的方式，但作为一个开始，你应该能够根据需要进行调整。
您可以使用 DOMParser API 来解析和操作 HTML 代码：
post = '<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops.""Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops."</em></strong></p>'
function stripElements(post) {
const doc = new DOMParser().parseFromString(post, 'text/html');
doc.querySelectorAll('body :not(p)').forEach(el => el.replaceWith(el.textContent))
return doc.body.innerHTML;
}
console.log(stripElements(post))
我正在使用 ngx-quill 和输入主体 returns 一些 HTML 元素。
例子
<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust
我想删除所有 HTML 标签，换行段落除外。
当 post 有多个行/中断时，ngx-quill 添加几个链式 <p></p><p></p>（见上文）
我尝试使用 replace 函数去除元素，但某些元素如 <u> 没有被去除。另外，如何将具有多个换行符的部分合并为一个换行符
我试过了
post = '<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops.""Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops."</em></strong></p>'
function stripElements(post: any) {
let newPost = post;
newPost = newPost.replace('<u>', '<span>');
newPost = newPost.replace('</u>', '</span>');
newPost = post.replace('<strong>','');
newPost = newPost.replace('</strong>', '');
newPost = newPost.replace('<em>', '');
newPost = newPost.replace('</em>', '');
newPost = newPost.replace('<p><br></p>', '<p></p>')
return newPost;
}
规则 #1：不要使用正则表达式操纵 HTML。请改用 DOM 解析器。
规则 #2：您可能不想为 DOM 解析器的开销烦恼，只想完成工作，并且可能会忽略规则 #1。
因此，如果您愿意，这样的事情可能会奏效：
return post.replace(/<\/?[a-z]+>/gi, m => m.toLowerCase() === '<br>' ? '<p></p>' : '');
我不太确定这就是你想要处理换行符的方式，但作为一个开始，你应该能够根据需要进行调整。
您可以使用 DOMParser API 来解析和操作 HTML 代码：
post = '<p><strong><em><u>"Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers </u></em></strong></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><br></p><p><strong><em>to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops.""Soft fingers began to tap the sill of the car window, and the hard fingers tightened on the restless drawing sticks. In the doorways of the sun-beaten tenant houses, women sighed and then shifted feet so that the one that had been down was now on top, and the toes working. Dogs came sniffing near the owner cars and wetted on all four tires one after another. And chickens lay in the sunny dust and fluffed their feathers to get the cleansing dust down to the skin. In the little sties the pigs grunted inquiringly over the muddy remnants of the slops."</em></strong></p>'
function stripElements(post) {
const doc = new DOMParser().parseFromString(post, 'text/html');
doc.querySelectorAll('body :not(p)').forEach(el => el.replaceWith(el.textContent))
return doc.body.innerHTML;
}
console.log(stripElements(post))