html字符串格式化

src/views/businessInfo/index.vue

@@ -61,7 +61,7 @@
 							</el-table-column>
 							<el-table-column label="内容" width="600">
 								<template slot-scope="scope">
-									<span v-text="removeHtmlTags(scope.row.content)"></span>
+									<div class="content-style" v-html="removeEmptyTags(scope.row.content)"></div>
 								</template>
 							</el-table-column>
 							<el-table-column label="发布时间" align="center" width="100">
@@ -123,7 +123,8 @@
 			</div>
 			<div slot="footer" class="dialog-footer">
 				<el-button class="add-user-cancel-btn" @click="dialog_get_article = false"> 取消 </el-button>
-				<el-button :class="dialog_get_article_btn_disable?'':'add-user-confirm-btn'" :loading="dialog_get_article_btn_disable" @click="handle_get_article" :disabled="dialog_get_article_btn_disable"> 确定 </el-button>
+				<el-button :class="dialog_get_article_btn_disable?'':'add-user-confirm-btn'" :loading="dialog_get_article_btn_disable"
+					@click="handle_get_article" :disabled="dialog_get_article_btn_disable"> 确定 </el-button>
 			</div>
 		</el-dialog>
 		<!-- 资讯详情 -->
@@ -159,7 +160,7 @@
 	import {
 		isEmpty
 	} from '@/js/common';
-	
+
 	export default {
 		data() {
 			return {
@@ -337,8 +338,52 @@
 				});
 			},
 			// 移除文章内容中的html标签
-			removeHtmlTags(str) {
-				return str.replace(/<[^>]*>/g, '');
+			removeEmptyTags(htmlString) {
+				// 确保htmlString不是空的
+				// if (!htmlString) {
+				// 	console.error('HTML string is empty or null');
+				// 	return '';
+				// }
+
+				// 创建一个新的DOM元素，用于解析HTML字符串
+				const parser = new DOMParser();
+				const doc = parser.parseFromString(htmlString, 'text/html');
+
+				// 检查body元素是否存在
+				// if (!doc.body) {
+				// 	console.error('Parsed document does not have a body element');
+				// 	return '';
+				// }
+
+				// 递归函数，用于深度优先搜索并处理节点
+				function cleanNode(node) {
+					// 遍历子节点
+					Array.from(node.childNodes).forEach(child => {
+						if (child.nodeType === Node.ELEMENT_NODE) {
+							// 如果是元素节点，递归调用cleanNode
+							cleanNode(child);
+						} else if (child.nodeType === Node.TEXT_NODE && !child.nodeValue.trim()) {
+							// 如果是文本节点且内容为空，则移除
+							node.removeChild(child);
+						}
+					});
+
+					// 检查是否包含特定文本内容，如果包含，则删除该节点
+					if (node.textContent.trim() === '更多精彩内容请关注我们' || node.textContent.trim() === 'END') {
+						node.parentNode.removeChild(node);
+					}
+
+					// 如果当前节点没有子节点，则移除当前节点
+					if (node.childNodes.length === 0) {
+						node.parentNode.removeChild(node);
+					}
+				}
+
+				// 从body开始清理
+				cleanNode(doc.body);
+
+				// 返回修改后的HTML字符串
+				return doc.body.innerHTML;
 			},
 			// 获取文章
 			article_get() {
@@ -690,5 +735,18 @@
 		border-radius: 5px !important;
 		margin-left: 28px !important;
 	}
-	
+
+	.content-style {
+		height: 200px;
+		overflow: auto;
+	}
+
+	.content-style::-webkit-scrollbar {
+		width: 2px;
+		height: 2px;
+	}
+
+	.content-style::-webkit-scrollbar-thumb {
+		background-color: rgba(9, 101, 98, 0.5);
+	}
 </style>