如何将新创建的html元素绑定到它的css

问题描述：

我通过javascript动态添加了新的html元素，并且这些新创建的html元素具有一个已经存在于链接style.css文件中的css类。我如何让这个新创建的元素知道他的css类，以便这个类的样式可以影响新创建的html元素。如何将新创建的html元素绑定到它的css

我的JS：

for(k=1;k<=5;k++){ 
    if(k==data[i]['price']){ 
html = html + '<input class=\"star\" type=\"radio\" name=\"test-5\" disabled=\"disabled\" value=\"'+k+'\" checked=\"checked\" />'; 
    }else{ 
html = html + '<input class=\"star\" type=\"radio\" name=\"test-6\" disabled=\"disabled\" value=\"'+k+'\"/>'; 
    } 
}

该类star应该在创建后是流行的css文件。在jQuery中有没有任何的功能make-popular？

希望我解释我的问题以及..

感谢

'k'全球？另外，您不需要在单引号内跳过双引号...... – elclanrs 2013-03-18 03:39:51

当您插入新的HTML时，您没有任何操作，它将拾取现有的样式。你不必用'\\'来逃避'''。 – Robin 2013-03-18 03:40:24

http://jsfiddle.net/vigneshvdm/VcAnF/ 你在找这样的东西！？！ – 2013-03-18 03:43:33

答

只要页面已经引用CSS文件，那么所有你需要做的就是与类=“明星”创建元素属性。我没有看到你最终用html变量做了什么，但是假设你的元素出现在class="star"属性的页面上，并且你已经正确声明了一个星形的css类，那么这就是所需要的。使用F12开发人员工具检查浏览器中的元素以验证该类正在被应用。

实施例：

http://jsfiddle.net/mQKdc/

$(function(){ 
    $('#addToMe').html('<div class="star">test</div>'); 
});

编辑：注意然而，该输入元件是困难的风格，因为每个OS（赢/ Linux的）和/或浏览器（IE， Firefox，Chrome）可以提供他们自己的输入元素样式。有些东西你可能会发现很难对它们进行设计。在这种情况下，它不是一个javesceiprt问题，而是一个CSS问题。你需要问一个CSS相关的问题，以显示1）你的CSS是什么，2）你的目标是什么，3）你看到的是什么，表明你当前的CSS不符合目标（即你的问题）。

编辑2： 之前排序，元素的HTML：

<div role="text" aria-label="" class="star-rating rater-0 star star-rating-applied star-rating-readonly star-rating-on"> 
    <a title="2">2</a> 
</div>

输入的是有太多，但风格被应用到这个元素。星形样式被施加到<a>元素：

div.star-rating a { 
background: url(../images/star.gif) no-repeat 0 0px; 
}

排序后，在div +一个不存在，只有输入。 这样的样式应用到的元素（div.star-rating a不存在：

<input class="star" type="radio" name="test-1-rating-5" disabled="disabled" value="4">

那么，你是排序后生成HTML是不正确的基础上，在排序前我看到的HTML是否使用某种插件/库产生的星星。如果是这样，我的猜测是有一些功能，你会打电话来产生正确的HTML

解决方案：？ 看起来你应该做这样的事情来运行。您需要激活星级插件的每个元素上的rating（）函数：

$('.star').rating();

您只需在生成新元素后运行此操作。

我会推我的开发在线，请给我3分钟，然后我会告诉你我的问题是什么 – doniyor 2013-03-18 03:49:00

@ doniyor css正在被覆盖！您需要指定star css中的所有属性为！important 它将解决问题 – 2013-03-18 04:13:27

@ doniyor这就是为什么您应该使用F12工具检查元素以确定正在应用哪些CSS。告诉你什么影响你的元素的造型。Chrome或Firefox + Firebug是最好的我的想法。你应该阅读“CSS特性”来理解为什么你的CSS被覆盖。 – AaronLS 2013-03-18 04:16:40

答

如果您要添加使用现有Css的新html元素，那么这些元素应该能够默认使用它们。你有什么问题吗？

如何将新创建的html元素绑定到它的css

相关推荐