Question

在我的HTML中，一个div块（其id看起来像kdsm_32532535）是在dom加载大约15-20秒后动态创建的。我想用javascript和下面的代码来设置这个块的样式。

<script type="text/javascript">
$(document).ready(function(){

if($("div[id^='kdsm_']").length > 0){ 
  $(this).css({'margin':'20px','border':'1px dotted red;'});
}
  /* OR below code. None of them working :( */     
  $("div[id^='kdsm_']").css({'margin':'20px','border':'1px dotted red;'});
});
</script>

如果我在document.ready中执行此操作，它将无法正常工作，因为DOM准备就绪不存在此div块。

如何在分数间隔内连续检查此div块是否已加载？

Answer 1

您应该在脚本中调用此方法，将新块放入DOM。或者使用setInterval方法：

function applyCss(){

if($("div[id^='kdsm_']").length > 0){ 
  $(this).css({'margin':'20px','border':'1px dotted red;'});
}
  /* OR below code. None of them working :( */     
  $("div[id^='kdsm_']").css({'margin':'20px','border':'1px dotted red;'});
}

var interval = setInterval('applyCss()',2000);

如果您想停止此间隔：

window.clearInterval(interval)

Answer 2

您可以为这些动态创建的div设置公共类，因此CSS规则将自动应用，如下所示：

.kdsm_divs { margin:20px, border: 1px dotted red; }

或者您可以使用将检查DOM状态的.ready（）方法。试试这个：

$("div[id^='kdsm_']").ready(function () {
  $("div[id^='kdsm_']").css({'margin':'20px','border':'1px dotted red;'});
});

Answer 3

使用样式表怎么样？

您可能知道将放置div的上下文，以便您可以设置样式规则并让浏览器自动应用样式。

加载后检查并处理div块

3 个答案: