在将DOM元素添加到文档之前操作它们

我只是想知道在将元素附加到DOM之前是否有一个干净的实现来获取元素。

示例（w / jQuery）：

var html = "
Hello!
"; var innerDiv = $(html).find('.innertest'); 

---

我觉得这是不可能的，但我想看看是否有任何实现允许这一点 – 因为这对于类和分离来说非常好。

编辑：我想知道这是否可行。 我的意思是干净，它不像字符串替换或黑客攻击。 这不是我制作它们的情况。 如果我可以制作它们，我会随便创建变量。 我有一个情况，我有这个html字符串，我想找到元素和操作之前我将它附加到我的页面。

Answer 1

你看过DOM DocumentFragments了吗？

Answer 2

这就是我最终做到的方式：

 var test = $("
"); test.append(html); test.find(".innertest"); // When I'm ready to append it.. $('#container').append(test); 

我不得不修改我的HTML流，但这最终成为一种干净的方法。 谢谢你的所有建议！

Answer 3

 var new_element = $(html); new_element.find('.innertest').doStuffToIt(); //last one isn't an actual method // and when you're done... new_element.appendTo('#container'); 

您不需要修改HTML流，因为不需要额外的div 。

我正在寻找同样的事情（这就是我到达这里的方式）并在阅读了你所得到的解决方案之后，我想出了这个。 它对我需要的东西很有用。

Answer 4

 var test = $('
').addClass('test').append( $('
').addClass('innertest').text('Hello!') ), innerDiv = test.find('.innertest').parent().appendTo('body') 

这是在追加到body元素之前进行的操作。 这是你的意思吗？ 如果没有，请指定？

Answer 5

我相信你现在拥有的东西会起作用。 例如，要更改内部div的文本，您可以执行以下操作：

 var html = '
Hello!
'; $(html).find(".innertest").text("Goodbye!"); 

Answer 6

据我所知，您希望在显示之前编辑某个DOM以满足您的需求 ，就像您操作当前在显示中的DOM一样。

我宁愿建议为此做一个解决方法，我为了类似的目的多次使用它

1. 首先附加 DIV /元素并立即隐藏它 。
2. 之后您可以随意编辑它 。
3. 做任何类型的编辑 / CSS应用程序/ DOM Manip，然后取消隐藏元素 或删除它，如果你只是想要一些数据。
4. 当当！

编辑要解决可能闪烁的问题，您可以做另一件事。

1. 创建一个空DIV并隐藏它（隐藏一个空div可能不会导致闪烁，因为它会发生得非常快）
2. 然后追加你想要的DOM对象（当它被隐藏时）
3. 然后对它施以怜悯。

如果我理解你的问题错了，请告诉我。

Answer 7

如果将一串有效的HTML传递给jQuery() ，它将返回一个jQuery对象，并重新创建DOMElements。 然后，您可以在以后将该对象附加到正文，即：

  var newDiv = $("
Hello!
"); var innerDiv = newDiv.find('.innertest'); innerDiv.css('background-color', 'blue'); $('body').append(newDiv); 

Answer 8

如果您有xml或xhtml，您可以使用jQuery操作它，如下所示：

 var html = "
Hello!
"; var domFragment = $(html); domFragment.find('.innertest'); //More jQuery... 

创建一个操作片段也适用于xml POST / GET响应。