在HTML中嵌入代码片段时，浏览器有时会错误地将代码解析为普通文本，而非可执行代码，导致代码格式错乱，高亮失效等问题。本文将通过一个案例分析此问题并提供解决方案。
假设我们从txt文件中读取文章内容，其中包含代码块，并使用jQuery的html()方法渲染到网页。txt文件内容如下：
这是一段示例文本。
这是第二段文本。
```javascript
function myFunction() {
console.log("Hello, world!");
}
前端代码：
```javascript
$("#article-content").html(article_content);如果后端返回的是一个数组（例如，逐行读取文件的结果），html()方法会将数组中的每一行都作为独立的文本节点处理，导致代码块被破坏。
问题的核心在于后端返回的数据类型。直接使用数组作为html()方法的参数会导致渲染错误。 解决方案是将后端返回的数组元素拼接成单个字符串后再进行渲染。
立即学习“前端免费学习笔记（深入）”；
后端修改 (Python示例):
with open('article.txt', 'r') as file:
article_content = file.read() # 直接读取整个文件为字符串前端代码保持不变:
$("#article-content").html(article_content);通过将后端返回的数据转换为单个字符串，前端就能正确地将代码块渲染为代码块，而非普通文本，从而解决代码显示和格式化问题。 这确保了代码的正确显示和代码高亮功能的正常工作。
通过以上调整，浏览器将正确地识别并渲染代码块，避免了代码被解析为外部文本节点的问题。
以上就是如何防止浏览器将HTML中的代码解析为外部文本节点？的详细内容，更多请关注php中文网其它相关文章！
HTML怎么学习？HTML怎么入门？HTML在哪学？HTML怎么学才快？不用担心，这里为大家提供了HTML速学教程(入门课程)，有需要的小伙伴保存下载就能学习啦！
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
936
