同じスタイルシートを持つdivを作成するにはどうすればいいですか？

Question

これは私のコードです。私は私の 'content1' divで動的divコンテンツリストを取得したいと思います。 たとえば、このページが読み込まれると、私はいくつかの情報を得るためにajaxリクエストを行います。情報によると、 'accountContent' divと同じスタイルシートを持ちますが、内容が異なるdivをいくつか作成します（divの数は情報配列の数からです）。

<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> 

それはこのスクリーンショットのように示しています

Answer 1

あなたのページに追加し、任意のマークアップがすでにページに適用されるCSSルールでスタイリングされます。あなたのケースでは、それらの新しいDIVにを単に適用する必要があるように思えます。

スタイルシートを作成する必要はありません。既にページにあるスタイルと異なるスタイルを持っている場合は、適用したCSSセレクタを現在のCSSファイルの新しいDIVに追加するだけです。 Ajaxが新しいDIVをページに追加すると、それらは一致するセレクタに従ってスタイル付けされます。