Question

我有

<div class="container">red</div>
<div class="container">green</div>
<div class="container">#eeeeee</div>

我想为内部HTML所拥有的每个div设置背景颜色比如第一个div的背景颜色必须是红色，第二个颜色必须是绿色。

我不想使用CSS因为我有超过50个div所以它的长代码在CSS中我是javascript的初学者，我们可以通过一些代码行来做到这一点。

Answer 1

您可以使用css()方法：

$('div.container').css('background-color', function() {
    return $(this).text();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="container">red</div>
<div class="container">green</div>
<div class="container">#eeeeee</div>

Native JS版本：

var elements = document.querySelectorAll('div.container');
for (var i = 0; i < elements.length; i++) {
  elements[i].style.backgroundColor = elements[i].innerText;
}

Answer 2

我认为这就是你想要的......

<强>的jQuery

$('.container').each(function(){
    $(this).css('background', $(this).text());
});

<强> JS

var elems = document.querySelectorAll('.container');
for (var i = 0; i < elems.length; i++) 
{
  elems[i].style.backgroundColor = elems[i].innerText;
}

Answer 3

这应该有帮助：）

@Override
public Identifier determineBasicColumnName(final ImplicitBasicColumnNameSource source)
{
    // Get 'this$0' field and make it accessible
    Field ejb3ColumnField = null;
    final Field[] sourceFields = source.getClass().getDeclaredFields();
    for (final Field sourceField : sourceFields) {
        if (sourceField.getName().equals("this$0")) {
            ejb3ColumnField = sourceField;
        }
    }
    ejb3ColumnField.setAccessible(true);

    // Get actual field object
    String owningEntityName;
    Ejb3Column ejb3Column;
    try {
        ejb3Column = (Ejb3Column) ejb3ColumnField.get(source);
    } catch (
        IllegalArgumentException
        | IllegalAccessException e) {
        throw new RuntimeException(e);  // (Or deal with this appropriately, e.g. log it.)
    }

    // The property holder path holds the owning entity's fully qualified name
    final String owningEntityFullyQualifiedName = ejb3Column.getPropertyHolder().getPath();

    // The entity name is after the last dot in the fully qualified name
    final String[] owningEntityTokens = owningEntityFullyQualifiedName.split("\\.");
    owningEntityName = owningEntityTokens[owningEntityTokens.length - 1];

    final Identifier basicColumnName = super.determineBasicColumnName(source);
    return Identifier.toIdentifier(owningEntityName + "_" + basicColumnName.toString());
}

根据您的评论

更新

纯JS版：

如果您正在为现代浏览器开发网站，则可以使用querySelectorAll。

$(".container").each(function (){
    $(this).css('background', $(this).text());
});

或者您可以将此功能用于旧浏览器。

var containers = document.querySelectorAll('.container');
for(var i=0;i<containers.length;i++){
   containers[i].style.background = containers[i].innerHTML;
}

Answer 4

您可以使用每个功能

$('.container').each(function(){
    var color = $(this).text();
    $(this).css('background',color)
})

.container{
    width:100px;
    height:100px;
    display:inline-block;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<div class="container">red</div>
<div class="container">green</div>
<div class="container">#eeeeee</div>

如何将每个div背景设置为内部HTML

4 个答案: