您现在的位置:首页 >> 前端 >> 内容

HTML动态加载实例介绍

时间:2018/6/2 13:57:35 点击:

  核心提示:这两天在准备一个比赛,需要制作一个网页,服务器基于django框架。而在这其中遇到了一些的问题,特别是关于如何动态显示由py提交的爬虫数据,一开始方案思路通过给客户端反馈由Py拼接而成的html,但是...

这两天在准备一个比赛,需要制作一个网页,服务器基于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); 

Tags:HT TM ML L动 
作者:网络 来源:qq_3413357