我正在尝试设计一种方法，当添加一个带有类和一些 data-* 的简单 div 元素时，它将替换它或添加一些其他元素。该方法不应手动调用，而应通过某种 .live() jQuery 方法、自定义事件或 $('body').bind('create.custom') 等自动调用。 我需要这种方式，因为我不会提前知道将创建哪些元素，因为它们将通过 ajax 提供，如单个空 div 或 p 。
<!DOCTYPE html>
<html>
<head>
<title >on create</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" ></script>
<script type="text/javascript" >
jQuery(function($){
$("div.fancyInput").each(function(index,element){
var $div = $(this);
var dataId = $div.attr("data-input-id");
var inputId = '';
var labelId = '';
if(!!dataId){
inputId = 'id="' + dataId + '"';
labelId = 'id="' + dataId + 'Label"';
} // if
var dataValue = $div.attr();
$(
'<p class="fancyInput" >' +
' <label ' + labelId + ' for="' + inputId + '" >A fancy input</label>' +
' <input ' + inputId + ' name="' + inputId + '" value="A fancy input" />' +
'</p>'
).appendTo($div);
}); // .each()
}); // jQuery()
</script>
<script type="text/javascript" >
jQuery(function($){
var counter = 2;
var $form = $('#form');
$('#add').click(function(event){
$('<div class="fancyInput" data-input-id="fancyInput' + counter + '" ></div>').appendTo($form);
counter++;
}); // .click
}); // jQuery()
</script>
</head>
<body>
<a id="add" href="#" > add another one </a>
<form id="form" action="#" >
<p class="normalInput" >
<label id="normalInputLabel" for="normalInput" >A normal input</label>
<input id="normalInput" name="normalInput" value="A normal input" />
</p>
<div class="fancyInput" ></div>
</form>
</body>
</html>
更新: 我事先检查了 liveQuery，它就是我需要的那种功能，但能够在执行事件回调时修改 DOM 元素。因此，我不仅需要附加事件，还需要在创建元素时修改 DOM 的能力。例如:每当创建一个新的时，都应该用 p、label 和 input 标签填充(如果替换的话更好)
最佳答案
您可以使用 DOM Level 3 事件，例如 DOMNodeInserted。这可能看起来像:
$(document).bind('DOMNodeInserted', function(event) {
// A new node was inserted into the DOM
// event.target is a reference to the newly inserted node
});
作为替代方案，您可以查看 .liveQueryhelp jQuery 插件。
更新
引用您的评论，请查看http://www.quirksmode.org/dom/events/index.html ，这个世界上只有Internet Explorer不支持它(我猜至少IE9是这样的)。
关于性能我不能说太多，但它应该表现得相当好。
关于javascript - 如何捕获 DOM 元素的创建并使用 jQuery 操作它们，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4915387/