如何将样式分配给 Javascript 变量？答案

【问题标题】：How do I assign styling to a Javascript variable?如何将样式分配给 Javascript 变量？
【发布时间】：2012-01-19 02:52:41
【问题描述】：

我有一个简单的动态电子邮件表单字段。用户提交电子邮件后，他们会收到消息“知道了！”。我需要字符串“知道了！”在我的 css 中具有与我的 <p> 标记相同的样式。但我不知道如何在 javascript 中分配属性，而代码的另一部分是 ruby，我也不知道。这可能是一个简单的修复，但我找不到答案！

这里是javascript：

var finalText =
        'Got it!';


// Create a new div that will contain our thank you stuff
var thankyouDiv = document.createElement("div");
thankyouDiv.id = "home_thankyou";
thankyouDiv.innerHTML = finalText;

// Store reference to the formm
var form = document.getElementsByTagName("form")[0];

// Add the new thankyoudiv before the form
form.parentNode.insertBefore( thankyouDiv, form  );

// remove the form tag alltogether
form.parentNode.removeChild(form);

这里是 html/ruby 代码：

<%= form_for :home, :remote=>true, :update=>"emailsubmit", :url => {:controller=>"home", :action=>"create"} do |f| %>
<div id=emailsubmit><%= email_field("infosignup", "email", :placeholder=>"Enter your email") %></div>
<%= submit_tag("", :id=>"arrow2") %>

有什么帮助吗？

【问题讨论】：

标签： javascript ruby-on-rails css ajax

【解决方案1】：

这不是您需要设置样式的 JavaScript，而是您编写它的 <div>。

为您的新 div 分配一个类：

// Create a new div that will contain our thank you stuff
var thankyouDiv = document.createElement("div");
thankyouDiv.className = "someClass";
thankyouDiv.id = "home_thankyou";
thankyouDiv.innerHTML = finalText;

然后在您的 CSS 中，使用与 <p> 定义的相同规则定义类：

p, .someClass {
  color: red;
}

【讨论】：