使用jQuery生成HTML

我想使用jQuery生成一些HTML，我想只创建具有所需的类等元素，然后将它们附加到对方，如果这是有道理的。我写了下面的代码，它不会产生任何错误，但也不会将HTML添加到容器中。使用jQuery生成HTML

怎么了？

(function($) { 
    $.fn.twitter_plugin = function(options) { 

    var container = this[0]; 

    console.log('Started'); 
    // Make aJax call 

    // Generate HTML 
    $con = $("<div>", { "class" : "tweet" }); 
    $(container).append($con); 
     $col1 = $("<div>", { "class" : "twocol" }); 
     $con.append($col1); 
     $col2 = $("<div>", { "class" : "tencol last" }); 
     $con.append($col2); 

     // Profile Image 
     $tweet_profile_div = $("<div>", { "class" : "tweet-profile-photo" }); 
     $col1.append($tweet_profile_div); 
      $profile_img = $("img", { "src" : '', "class" : "responsive-img" }); 
      $tweet_profile_div.append($profile_img); 
     // END Profile Image 

     // Tweet 
     $tweet_head = $("div", { "class" : "tweet-head" }); 
     // END Tweet 

    }; 
}(jQuery));

执行此像这样：

<script src="js-src/themev2/twitter_plugin.js"></script> 
<script> 
$(document).ready(function() { 
    $("#map_canvas").twitter_plugin({ }); 
}); 
</script>

编辑1

@Sean默，如显示的console.log被没有你认为改变执行我的twitter_plugin功能，，所以这不是问题

来源

2016-07-28 Martyn Ball

你得到你的控制台日志？ – Adjit

你有没有包含jQuery？ – gaetanoM

问题是，你有一个jQuery的IIFE，但在你有你的'$ .fn.twitter_插件函数'已定义但未调用。在函数定义的末尾，您应该添加（）来调用它。

所以

 $tweet_head = $("div", { "class" : "tweet-head" }); 
     // END Tweet 
    };

应该

 $tweet_head = $("div", { "class" : "tweet-head" }); 
     // END Tweet 

    }();

我也不知道这[0]是完全可靠的，可能是更好的只是身体保存为您的容器元素。这只是一个窗口对象，所以它没有0索引元素

var container = $('body') 会解决你的问题。

来源

2016-07-28 17:58:32

'this [0]'获得从这里定义的元素$（“＃map_canvas”）。twitter_plugin（{}）;'因为我需要将新元素放在那里，而不是放在主体中。并感谢我的问题的答案:) –

请参阅编辑，missing（）不能解决问题。 –

我犯的愚蠢的错误，代码工作正常，我只是拼错目标元素的ID，现在这个工作。

来源

2016-07-29 08:46:58

使用jQuery生成HTML

回答

相关问题