如何操作jQuery变量中的HTML？

Question

我试图操纵存储在jQuery的变量中的HTML。在将变量写入文档之前，我想做这个操作。

所以，我有一个变量定义为：

var sighting = "<div><span class="feed_name"></span></div>"; 

而且我想提出的 “Hello World” 的span元素。这是我不能得到部分的工作：

$(sighting).("span.feed_name").html(name); 

然后我写了“瞄准”变量页面：

$(#sightings).append(sighting); 

这使在HTML中瞄准可变进<div id="sightings"></div>元素在页面上。

任何帮助将不胜感激！

感谢，

马克

Answer 1

试试这个：需要

var sighting = "<div><span class=\"feed_name\"></span></div>", 
    $elem = $(sighting).find("span.feed_name").text("hello world").parent(); 
$("#sightings").append($elem); 

的parent电话要回外div。

Answer 2

我喜欢这种方法，你必须在元素的更多控制，因为他们仍然为对象，并因此更容易强迫进入功能。

sighting = document.createElement('div'); 

然后你就可以操作，就好像它已经是DOM

$(sighting).addClass("feed_name").html(name); 
$(sighting).appendTo("#sighting"); 

编辑

嗯的一部分...看来我误解你的问题。我仍然希望使用createElement()函数来制作元素。

sighting = document.createElement('div'); 
sighting_contents = document.createElement('span'); 

$(sighting_contents).addClass("feed_name").html(name); 
$(sighting).append(sighting_contents); 
$(sighting).appendTo("#sightings"); 

有点冗长，但你可以串最后三成一个长行，如果你想......我想，这是更具可读性，并最终给你更多的控制，因为在技术上你不应该写在你的js中有一堆HTML，你可以创建这些元素并追加它们，但就编写大块标记而言，我认为将这些元素创建为这样的对象会给你更多的灵活性。

您还可以将事件加入这样的元素在一个更简单的方法：。

$(sighting).bind("click", function(event) { 
    $(this).fadeOut(); 
});