Javascript 如何正确插入div以从jQuery中操作它们？

这里我有一些代码来创建具有指定类的div，在这个div中我创建了iframe来连接我的聊天小部件

(function(){ 
var client_id = '1',
    p= 'right',
    vp = 'bottom';
    h = '550',
    dw = '400';
var d=document;
var w=window;

function l(){

    var s = document.createElement('div');
    s.id = 'chatrix_init_widget'; 
    s.style = 'position: fixed; z-index:101010; '+p+': 0; '+vp+': 0; height:'+h+'px; width: '+dw+'px';
    var ss = document.getElementsByTagName('body')[0].appendChild(s);

    var i = document.createElement('iframe');
    i.className = 'chatrix_iframe_container';
    i.height = '100%';
    i.width = '100%';
    i.src = '//danialart.biz/chatrix/widget.php?c='+client_id;
    var ss = document.getElementById('chatrix_init_widget').appendChild(i);

}
function s() {
    var s = document.createElement('script');
    s.type = 'text/javascript'; 
    s.src = '//danialart.biz/chatrix/js/client_side.js';
    var ss = document.getElementsByTagName('body')[0].appendChild(s);
}

if(d.readyState=='complete'){
    l();
    s();
}else{
    if(w.attachEvent){
        w.attachEvent('onload',l);
        s();
}else{
    w.addEventListener('load',l,false); s();}}})();

---

在名为s（）的函数中，我创建了连接远程jquery文件函数的脚本标记，但该文件中的任何内容（execlude consolel.log命令）都不起作用。不点击，或者其他jquery操作根本不起作用。

当涉及到

iframe

时，通常会出现这个问题。我建议三种方法：

尝试对要对其执行jquery操作的元素加载

onload

：

$('#element').on('load',function(){
   //your action here for example click action
   $(this).on('click',function(){
   });
});

尝试在iframe上加载

onload

：

$('.chatrix_iframe_container').on('load', function(){
   //do your actions here
});

虽然有时上述方法都不起作用，但我使用

setInterval

，我通常不认为这是一种不好的做法

使用

setInterval

 function myAction(){
    if($('#element').length){
      // do your actions here
      clearInterval(timer);
     }
 }
 var timer = setInterval(function(){myAction();},1000);

我自己进行了测试，我可以通过以下修改使您的逻辑正常工作：

在

标记中添加jQuery：

替换脚本的开头：

(function(){

为此：

(function($){ 

3.在脚本末尾，使用以下命令：

if(d.readyState=='complete'){
    l();
    s();
}else{
    if(w.attachEvent){
        w.attachEvent('onload',function(){
          l();
          s();
        });
}else{
    w.addEventListener('load',function(){l();s();},false);}}})(jQuery);
</script>

if（d.readyState=='complete'）{
l（）；
s（）；
}否则{
如果（w.attachEvent）{
w、 attachEvent（'onload'，function（）{
l（）；
s（）；
});
}否则{
w、 addEventListener（'load'，function（）{l（）；s（）；}，false）；}}}）（jQuery）；

我复制了您的情况，现在它是这样工作的，因为我发现

w.addEventListener

是加载脚本的人，它甚至在

div

被添加到DOM（

l（）

）之前就添加了脚本标记（

s（）

）。这就是脚本不起作用的原因

---

我希望它有助于复制或相关：@DanialartBiz我复制了你的情况，我成功了。请检查更新后的解决方案是否对您有效。我尝试了所有三种解决方案，但没有一种像以前一样有效-我在元素上单击了所有内容，但没有任何结果。如果我直接插入div和iframe（不是在javascript中），我会质疑它的插入问题——我的jquery代码可以正常工作，但是如果我在加载DOM时创建它——这不是问题。问题是，当元素不在DOM中时，jquery代码试图将其作为目标，因此需要等待添加它，然后将其作为目标。现在我不知道为什么上面的解决方案都不起作用。在解决方案3中，删除行：

clearInterval（计时器）并重试。告诉我它是否有效。不，还是没什么变化。你能告诉我如何在DOM中以jquery的工作方式创建元素吗。我的目标是-创建小的js代码，每个用户都可以将其粘贴到他们的网站上，并从另一台服务器创建iframe、div和sonnect jquery js文件，以控制创建元素的过程？您需要注意的唯一一个事实是，只有在将动态添加的元素添加到DOM后，才尝试对其进行操作。这意味着，当元素不在DOM中时，任何试图执行的jquery都不起作用。在代码中，所有要执行的操作都放在调用
l（）
之后，这意味着您需要创建一个包含所有操作的函数，并在调用
l（）
之后调用该函数。