附加Div在创作时没有形成类名？

Question

我正在为我的网页首页上的新闻提要做一个CMS，当管理员向新闻源提交新闻时，我想在页面上显示新创建的新闻，我目前有

function showResponse(data) {
  console.log('Triggered');

    var rowDiv = document.createElement('div');
    rowDiv.id = 'rowDiv';


    var titleSpan = document.createElement('div');
    titleSpan.className = 'span9';
    titleSpan.innerHTML = data.success.title;
    console.log(titleSpan);

    var timeSpan = document.createElement('div');
    timeSpan.className = 'span9';
    timeSpan.innerHTML = data.success.createdAt;
    console.log(timeSpan);

    var bodySpan = document.createElement('div');
    bodySpan.className = 'span9';
    bodySpan.innerHTML = data.success.body;
    console.log(bodySpan);

    document.getElementById('newsfeed').appendChild(rowDiv);
    document.getElementById('rowDiv').appendChild(titleSpan);
    document.getElementById('rowDiv').appendChild(timeSpan);
    document.getElementById('rowDiv').appendChild(bodySpan);

}

// Jade template for node 
   div#newsfeed
     for info in newsFeed
      div(class='row', style='border-bottom: 1px solid lightgrey; margin-bottom: 1%; padding-top: 1%;')
       div.span9
        h2=info.title
       div.span9
        p.muted.credit=info.createdAt
       div.span9
        p= info.body

底部的那个小玉部分只是我用Node.js的html模板语言，所以这很好用，唯一的问题是，当它被添加到页面时，它看起来不像要从其类名中获得任何CSS样式，是否有人知道为什么会这样？

Answer 1

首先，你做错了，第二，你没有把类添加到rowDiv

var rowDiv = document.createElement('div');
rowDiv.className = "row" // <- this is your problem
rowDiv.style = "border-bottom: 1px solid lightgrey; margin-bottom: 1%; padding-top: 1%;" // <- and this you should identify in css
var titleSpan = document.createElement('div');
titleSpan.className = 'span9';
titleSpan.innerHTML = data.success.title;
rowDiv.append(titleSpan);
var timeSpan = document.createElement('div');
timeSpan.className = 'span9';
timeSpan.innerHTML = data.success.createdAt;
rowDiv.append(timeSpan);
var bodySpan = document.createElement('div');
bodySpan.className = 'span9';
bodySpan.innerHTML = data.success.body;
rowDiv.append(bodySpan);
document.getElementById('newsfeed').appendChild(rowDiv);

如果您已经在运行中生成页面，请尝试查看js模板系统，例如ejs，这样您就可以以更合适的方式存储模板