欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

HTML动态加载实例介绍

程序员文章站 2022-03-22 12:54:40
这两天在准备一个比赛,需要制作一个网页,服务器基于django框架。而在这其中遇到了一些的问题,特别是关于如何动态显示由py提交的爬虫数据,一开始方案思路通过给客户端反馈由py拼接...

这两天在准备一个比赛,需要制作一个网页,服务器基于django框架。而在这其中遇到了一些的问题,特别是关于如何动态显示由py提交的爬虫数据,一开始方案思路通过给客户端反馈由py拼接而成的html,但是如此处理,不能够调用css模块加以修饰,故考虑采用py提交json数据而由html中js动态加载的方式。尝试发现html可以通过{{name}}显示获取json中索引为‘name’的字典数据,在此基础上使用js对得到的数据加以显示

部分代码类似与下面

html部分:

var json_data = {{data}};

for (var key in json_data)

{

    switch (key)

    {

        case 'key_0':

        case 'key_1':

    }

}

python部分:

ctx={'key_0':    ,'key_1':    }

render(request, 'html_0.html', ctx) 

在于页面布局方面html布局中的居中可以通过<center></center>实现

动态修改界面中的table可以采取以下方式

<table id="table" ></table>

var tb = document.getelementbyid('table');

td = tb.insertrow(0);

td.insertcell(0);