时间戳

首页 > 解决方案 > 使用 jQuery 在新文档中创建元素

javascript - 使用 jQuery 在新文档中创建元素

问题描述

使用纯 JavaScript（没有 jquery），我可以打开一个新窗口（或选项卡）并将最小的 HTML 文档写入该窗口，如下所示：

var minimal = '<!DOCTYPE HTML>\n' +
 '<html>\n' +
 '<head>\n' +
 '<meta charset="utf-8">\n' +
 '<title>Title Here</title>\n' +
 '</head>\n' +
 '<body>\n' +
 '</body>\n' +
 '</html>\n';

var win = window.open();
var doc = win.document;
doc.open('text/html', true);
doc.write(minimal);
doc.close();

然后我可以使用纯 JavaScript 动态创建子元素并将其添加到新文档中，如下所示：

var body = doc.getElementsByTagName('body')[0];
var div = doc.createElement('div');
div.innerHTML = 'Hi Mom!';
body.appendChild(div);

请注意，我正在使用上面的代码，doc而不是document在新文档中创建一个 div。

我对jquery的理解是这段代码

var div = $('<div/>');

会在当前文档而不是新文档中创建一个div，在当前文档中创建的div不能添加到新文档中。有没有办法让 jquery 在新文档中创建元素，如上面我的纯 JavaScript 代码所示？

标签： javascriptjquerydom

解决方案

动态创建 DOM 元素而不将它们附加/父级到其他 DOM 元素将被丢弃。

var div = $('<div></div>');  // will create a div and wait for you to append it

所以你可以说：

div.appendTo("body");  // this will append it body

或者你可以说：

div.appendTo(win.document);   // the div will be appended somewhere else

推荐阅读