我试图在一个代码块中显示html、css和js，同时用正则表达式找到所有的url，并使它们可点击。
我大部分时间都在工作
我遇到的问题是，要么我可以呈现所有的代码，并有可点击的链接，要么我可以不呈现任何代码，链接是不可点击的
这是堆栈
服务器端“Python和Flask”

def highlightTargets(rawHtml):
    urlRegex = r'[http|ftp|https:\/\/]?[\w.-]*\.[\w]*'
    return re.sub(urlRegex, r'<a href="javascript:addTarget(`\g<0>`);"><0></a>', rawHtml.strip())

... endpoint code ....
    return render_template('page.html', data=highlightTargets(rawHtml))

客户端“引导程序5，Jquery 3.6.1”

<pre><code id="data"></code></pre>
<div id="hiddenData" hidden>{{ data }}</div>
<script>
    let data = $("#hiddenData").text();
    $("#data").html(data);

    function addTarget(target){
        //do work
    }
</script>

上面的代码正确地使链接可点击，但它也呈现了我只想显示的html。相反，我希望它使链接可点击，同时还允许您查看其他html。
有没有办法只呈现部分文本而不呈现其余部分？

（我还想问，如果你要投反对票，请帮助我改进，留下评论，为什么。谢谢）