jQuery:添加dom元素(如果它不存在)

Question

很长的问题

是否可以仅在尚未存在的情况下添加DOM元素？

例

我已经实现了这样的要求:

var ins = $("a[@id='iframeUrl']");
ins.siblings('#myIframe:first').remove().end().parent().prepend('<iframe id="myIframe"  src="'+ins.attr("href")+'"></iframe>');

是否有可能用更优雅的东西取代第二条线？喜欢ins.siblings('#myIframe:first').is().not().parent().prepend......

我可以检查ins.siblings('#myIframe:first').length然后添加IFrame,但好奇心接管了,我试图用尽可能少的语句来做到这一点.

Answer 1

我认为你建议的方式(计算长度)是最有效的方式,即使它确实涉及更多的代码:

var ins = $("a[@id='iframeUrl']");

if(ins.siblings('#myIframe:first').length == 0)
    ins.parent().prepend('<iframe id="myIframe"  src="'+ins.attr("href")+'"></iframe>');

此外,:first选择器在这里是多余的,因为只有一个元素具有该ID,因此:

var ins = $("a[@id='iframeUrl']");

if($('#myIframe').length == 0)
    ins.parent().prepend('<iframe id="myIframe"  src="'+ins.attr("href")+'"></iframe>');

也会有用.

编辑:正如Fydo在评论中提到的,长度检查也可以缩短,所以最简洁的形式是:

var ins = $("a[@id='iframeUrl']");

if(!$('#myIframe').length)
    ins.parent().prepend('<iframe id="myIframe"  src="'+ins.attr("href")+'"></iframe>');

请注意if条件下选择器前的感叹号!