首頁猿問怎么用js動態(tài)生成html頁面（包...

怎么用js動態(tài)生成html頁面（包含創(chuàng)建很多不同類型input）

Html/CSS JavaScript

落落妞 2017-05-15 16:09:04

查看完整描述

1 回答

無所畏懼小小小

TA貢獻(xiàn)20條經(jīng)驗獲得超5個贊

首先先引入jQuery（原生js也能實現(xiàn)，只是個人覺得jquery對dom操作更簡單）

js中代碼如下：

(function(){
	$("body").html('<input?type="button"?name=""?id=""?value="點我"?/>');
})()

其他類型的input標(biāo)簽根據(jù)上邊代碼自己加就ok。

不想用jquery就用下面的代碼...

(function(){
	var?body=document.getElementsByTagName('body')[0].innerHTML+='<input?type="button"?name=""?id=""?value="點我"?/>';
})()

1 反對回復(fù) 2017-05-15

落落妞
首先謝謝你只是我要的不是這么簡單的，我說的js創(chuàng)建是通過頁面單選或者多選的設(shè)置組成一個對象數(shù)據(jù) 根據(jù)數(shù)據(jù)創(chuàng)建html

回復(fù) 2017-05-16
__記憶
厲害了，學(xué)習(xí)這么用功

回復(fù) 2017-05-17
無所畏懼小小小
如果只用js中寫好的數(shù)據(jù)（靜態(tài)數(shù)據(jù)），我一般用angularjs創(chuàng)建一個對象數(shù)組 $scope.bookTypes = [ { 'code': '0', 'name': 'All' }, { 'code': '1', 'name': 'eBook' }, { 'code': '2', 'name': 'Audio Book' }, { 'code': '3', 'name': 'Print Book' } ]; 然后頁面中使用ng-repeat遍歷數(shù)據(jù)顯示。如果你說的數(shù)據(jù)來自數(shù)據(jù)庫，原理也差不多，就是先用假數(shù)據(jù)確定好展示格式，然后請求數(shù)據(jù)庫信息，最后遍歷數(shù)據(jù)展示在頁面中。

回復(fù) 2017-05-17

關(guān)注