利用js在页面某处添加特定内容

最新推荐文章于 2020-03-24 15:40:32 发布

原创最新推荐文章于 2020-03-24 15:40:32 发布 · 348 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#JavaScript #ViewUI

Web学习专栏收录该内容

3 篇文章

订阅专栏

本文介绍了一种使用JavaScript动态地向网页添加查询结果的方法。通过循环迭代，每次查询都会生成带有不同ID的新div元素，并填充相应的路径、类型、名称和大小等信息。此方法有助于改善用户体验并提高页面响应速度。

[size=large]
假设我在前台搜索文件，将前台要搜索的内容传到后台进行操作，然后将后台的查询结果显示在页面上，假设设置一个<div id="list1"></div>，将查询结果放在list1的ID下面：
[/size]


var maxid=1;
var newid=2;
var tmp="hello:world:bye:world";
	function load()  //页面载入执行
	{

				for(i=0;i<10;i++)
				{
					$("#list"+maxid).after("<div id=\"list"+newid+"\"> <a href=\"#\">path:"+tmp.split(":")[0]+"  type:"+tmp.split(":")[1]+"  name:"+tmp.split(":")[2]+"  size:"+tmp.split(":")[3]+"</a> </div>");
					maxid = maxid + 1;
					newid = newid + 1;

				}
//或者是将要写入的内容放到一个var hehe=""; 
//hehe+=("<ul id=\"list"+newid+"\" class=\"ui-state-default ui-corner-all\"><img src=\"images/page.gif\" /><a href=\"#\" onclick=\"opendir(\'"+ tmp.split(":")[1]+":"+tmp.split(":")[2] +"\')\">"+tmp.split(":")[2]+"  size:"+tmp.split(":")[3]+"</a> </ul>");   $("#list1").after(hehe);
}