2016-03-27 11 views
0

Bu benim kodum. 'Content1' div'imde dinamik div içerik listesi almak istiyorum. Örneğin, . Bu sayfa yüklenmeye başladığında, bazı bilgileri almak için bir ajax isteği yapardım. Bilgiye göre 'accountContent' div ile aynı stil sayfasına sahip olan ancak farklı içeriğe sahip olan bazı div'ler (div sayısı info dizisinin sayısından) oluşturulur. aynı stil sayfasına sahip bazı div'ler nasıl oluşturulur?

<div class="main"> 
    <br> 
    <div id="content1" style=" border-radius: 8px; width: 100%;margin: auto; background-color: white;-webkit-box-shadow: 3px 3px 3px;-moz-box-shadow: 3px 3px 3px;box-shadow: 3px 3px 3px; "> 
    <br> 
    <div class="accountContent"> 
     <div style="width: 95%;margin: auto; background-color: rgb(245,245,245);height: 40px;border-radius: 10px"> 
     <div class="col-md-4" style="padding-top: 10px;"> 
      <p style="width:95%; margin: auto">公众号名称</p> 
     </div> 
     <div class="col-md-4" style="padding-top: 10px;"> 
      <p style="width:95%; margin: auto">接入状态:</p> 
     </div> 
     <div class="col-md-4" style="padding-top: 5px; "> 
      <button type="button" class="button button-small button-plain button-borderless" data-toggle="tooltip" data-placement="left" title="删除" style="float:right;"><i class="fa fa-times" style=" color: #101010"></i></button> 
     </div> 
     </div> 
     <div style="width: 95%;margin: auto; background-color: white;height: 50px;border-radius: 10px"> 
     <div class="col-md-4" style="padding-top: 10px;"> 
      <img src="images/default.jpg" style="width: 40px;height: 40px;border-radius: 20px;float: left"> 
     <div style="margin-left: 10px; padding-top: 10px;float: left"><p>物管助手</p></div> 
     </div> 
     <div class="col-md-4" style="padding-top: 20px;"> 
     <p style=" margin-left: 12px;float: left">接入成功</p><i class="fa fa-check" style="padding-top: 2px; padding-left: 2px;"></i> 
     </div> 
     <div class="col-md-4" style="padding-top: 10px;"> 
     <a href=# class="button button-pill button-tiny button-border " data-toggle="tooltip" data-placement="right" title="编辑公众号信息" style=" height: 36px;float: right;"><i class="fa fa-pencil" style="padding-top: 11px;"></i> 编辑</a> 
     <a href=# class="button button-pill button-tiny button-border" data-toggle="tooltip" data-placement="left" title="管理公众号功能" style="height: 36px;float: right;margin-right: 5px;"><i class="fa fa-wrench" style="padding-top: 11px;"></i> 功能管理</a> 
     </div> 
    </div> 
    <br> 
    </div> 
    <br> 
    <br> 
</div> 

Bu ekran görüntüsünde olduğu gibi gösterir

: sayfanıza eklemek I want to get more divs like this kind

cevap

1

Herhangi biçimlendirme zaten Sayfaya uygulanan CSS kurallarına tarz olacaktır. Durumunuza göre, bu yeni DIV'lere .accountContent'u uygulamanız yeterlidir.

Onlar için bir stil sayfası oluşturmanız gerekmez. Sayfada zaten olanlardan farklı stilleri varsa, mevcut CSS dosyanızdaki yeni DIV'lere uyguladığınız CSS seçiciyi eklemeniz yeterlidir. Ajax, yeni DIV'leri sayfaya eklediğinde, eşleştirdikleri seçicilere göre şekillendirilecekler.

İlgili konular