以我曾經寫過的例子舉例

如上圖，鄉鎮街道的名字和數目是根據數據庫的數據獲取的，有幾個鄉鎮，就會顯示出來幾個，這就要求動態獲取鄉鎮名稱和數目，以下代碼中用到了document.write創建動態頁面，在利用document.write時，注意轉義字符\的運用，要不然容易報錯

<script language="JavaScript"type="text/javascript">
var uid=getQueryString("userId");//獲取用戶鏈接id
var str=xz_xmsl(uid);//獲取鄉鎮名字和數量的函數 ?

var res=str.split('&');
document.write("<table style='margin:0 auto; margin-top:15px' width='920' border='0' cellspacing='0'>");
document.write("<caption align='left'>鄉鎮街道</caption>");
for (var i=1;i<=res.length;i++)
{

if((i%6)==1) ?//當鄉鎮數目余1時開始創建列表
document.write("<tr>");

document.write("<td width='250' valign='top'>");
document.write("<ul class='left_li'>");
document.write("<li class='ico5' onClick=\"gotopage1(\'\',\'項目查詢\',\'"+res[i-1].split(',')[0]+"\',\'\')\">");//gotopage1是獲取鏈接地址的函數，點擊某個鄉鎮，就會跳轉到這個鄉鎮的具體信息
document.write("<div class='title'>"+res[i-1].split(',')[0]+ "</div>");
document.write("<div>"+res[i-1].split(',')[1]+ "</div>");
document.write("</ii>");
document.write("</ul>");
document.write("</td>");
if((i%6)==0||i==res.length) //當項目數量余數0時或者等于總長時，開始換行
document.write("</tr>");
}
document.write("</table>");
</script>

?

函數xz_xmsl獲取鄉鎮名稱和數量

function xz_xmsl(USERID){
var USER_ID=USERID;
var str;
var inputValue=str+'|'+USER_ID;
var link=window.location.href.split('/');
var strUrl="http://"+link[2]+"/oa/extensions/PageEngine/StoredProcedureEngine.aspx?P_Name=TDZZ.PRO_TDZZ_XZ_XMSL&KeyValue="+inputValue+"&rand="+Math.random();//調用了存儲過程TDZZ.PRO_TDZZ_XZ_XMSL
str=GetXmlHttp(strUrl,"");
return str;
}

?

create or replace procedure PRO_TDZZ_XZ_XMSL(str out VARCHAR2 , USER_ID in VARCHAR2
??????????????????????????????????????????? ) is
???????? strresult VARCHAR2(2000);
??? --bmdm varchar2(20);
begin
strresult:='';
for n in (select t.xz,count(1) as cou
from v_subxmcx_list t where substr(t.xzq_dm,0,4)='3302' and t.userid=USER_ID ?and t.xz is not null? and t.xmzt!='3'

group by t.xz ) loop
strresult:=strresult||'&'||n.xz||','||n.cou;
end loop;
if strresult is not null then
???????? str:=substr(strresult,2);
end if;
EXCEPTION
??? WHEN OTHERS THEN
??????? RAISE;
??????? ROLLBACK;
end PRO_TDZZ_XZ_XMSL;

?

轉載于:https://www.cnblogs.com/huodige/p/8962846.html

總結

以上是生活随笔為你收集整理的js动态创建元素之一--document.write的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。