javascript - 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 条件中选择器前面的感叹号!