在 jquery 中的 document.ready 之后加载的 div 添加样式

Question

我在 django 中使用 calendar.js，我无法将样式 "z-index:1000" 添加到 div 和 class 名称为页面加载后加载的日历框。

我试过以下方法：

<script>
    $(document).ready(function(){
        $(".calendarbox").css("z-index", 1000);
    });
</script>

页面加载后正在加载日历框 Div。

CSS:

<div id="calendarbox0" class="calendarbox module" style="display: block; position: absolute; left: 2079px; top: 1340px;">
<div>
<div id="calendarin0" class="calendar">
--------

Answer 1

只需将此规则添加到 css 文件：

CSS

.calendarbox { z-index:1000 }

检查以下示例。

$('#add').on('click', function() {
  $('body').append('<span class="newElem">New element!</span>');
});

.newElem { color:red }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<button id="add">Add new element</button>

注意

最好将所有样式收集到一个css文件中而不是内联，所以在这里做一些修改（除非这个样式需要通过js计算）：

HTML

<div id="calendarbox0" class="calendarbox module">
<div id="calendarin0" class="calendar"> ...

CSS

.calendarbox {
  display: block;
  position: absolute;
  left: 2079px;
  top: 1340px;
}

.calendar { z-index:1000 }

在 jquery 中的 document.ready 之后加载的 div 添加样式

Add style to div which is loading after document.ready in jquery

javascript

css

django

jquery

calendar