一大段html代码转换为页面的方式

在Django项目中处理RSS订阅时,遇到description字段包含HTML代码导致页面显示异常的问题。尝试通过模板直接传递HTML,但因数据截断而失败。最终采用JavaScript动态修改ID并转换内容为HTML格式,成功解决显示问题。

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

PS:本人用的是django框架

最近在忙着一个项目,是做RSS订阅的。遇到一个问题,就是有的RSS里面的items元素中的 description这个元素,存放的是一大段html代码:如下图
这里写图片描述

之后要是直接显示在页面中,看起来很是难看

这里写图片描述

想了很多方法,一开始是打算用<iframe></iframe>的方法,但是因为订阅的RSS中的items数量是不确定的,不可能写一大堆html文件用来存储。

于是脑洞了一番,因为<iframe src=""></iframe>中的src是可以传值的,于是写了<iframe src="/test?a={{item}}"></iframe>(PS注意:{{item}}是后台传的值),直接将整个html代码传到后台(这个html代码是上图中的那一大段),结果发现,纯文字的时候,是可以成功传到后台的
这里写图片描述
上图是传递的值,但是!!!如果传的不是纯文字,换成我们上图的那一大段html代码,数据会被截断!!!
这里写图片描述
这是我获的数据的方法,讲道理应该都存到a里面才对,然后把a的值传到text.html中(text.html文件中只有{{description}})讲道理我们想的到的应该是下图这个样子的
这里写图片描述
(PS黑色部分是<iframe></iframe>显示的小的html窗口)

但是,显示却是这个样子的
这里写图片描述
他喵的竟然被截断,于是想了想应该是用get传递的时候,符号都被转义了,,于是出现了被截断的情况…于是放弃了这个想法

后来想到用js来搞事
一开始是受到id的障碍,因为items的数目不确定,我用的是{% for item in items %}循环出来,但是id不能一样呀,想了半天,想到用js来动态的修改!
js代码如下


var myid="1";
function mytest() {
    var id=document.getElementById("general");
    id.id=myid;
    myid++;
    b=$('#'+myid).text()
    $('#'+myid).html(b)
}

for循环生成item的代码如下


{% for item in urlitems.0 %}
<div class="accordion-inner">
    <a style="color: mediumspringgreen;" href={{item.link }}> 标题:{{ item.title }} </a>
    <br>
    <br>
    <div id="general">
        <p>{{ item.description }}</p>
    </div>
    <script>
    mytest()
    </script>
    </div>
{% endfor %}

让一开始的id是general,然后循环一次修改一次id的值,注意myid要放到函数外面做全局变量,要是放到函数里面每次调用的时候都会被重新赋值为1
于是,愉快的解决了id的问题
那么接下的问题就好解决的,用js获得传来的id中的<description>元素里面的内容,js代码中的第6行,在用第7行的代码将id的内容转换为html格式的,最终,大功告成了
这里写图片描述



这里再次做一下补充,昨天发完文章,同学告诉我可以直接用django官网文档里面提供的一个方法

<div id="general"><p>{{ item.description|safe }}</p></div>

就是直接在上文中的item.description后面加一个|safe就能转成html了,我试了一下,也是可以的
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值