document.importNode
document.importNode方法作用是：将外部文档的一个节点拷贝一份，然后可以把这个拷贝的节点插入到当前文档中。
语法
var node = document.importNode(externalNode, deep);
node： 导入当前文档的新节点，新节点的parentNode是null,因为它还没有插入到当前文档的文档树中，属于游离状态
externalNode：将要从外部文档导入的节点
deep（可选）：true | false，表明是否要导入节点的后代节点，默认true
注意: 在DOM4规范中 (实现于Gecko 10.0 (Firefox 10.0 / Thunderbird 10.0 / SeaMonkey 2.7)) ,deep 是个可选的参数. 如果省略不写,则使用默认值 true, 表示深度克隆. 如果你想使用浅克隆,则传入false参数.在没有实现DOM4的浏览器中, 这个参数不可以省略.
在这里，源节点不会从外部文档中删除，被导入的节点是源节点的一个拷贝
document.adoptNode
从其他的document文档中获取一个节点。 该节点以及它的子树上的所有节点都会从原文档删除 (如果有这个节点的话), 并且它的ownerDocument 属性会变成当前的document文档。 之后你可以把这个节点插入到当前文档中。
语法
var node = document.adoptNode(externalNode);
node： 导入当前文档的新节点，新节点的parentNode是null,因为它还没有插入到当前文档的文档树中，属于游离状态
externalNode：将要从外部文档导入的节点
示例：
//adoptNode.html
<!DOCTYPE html>
<html>
<head>
<title>adoptNode</title>
</head>
<body>
<iframe src="iframe.html"></iframe>
<button id="move">移动元素</button>
<script type="text/javascript">
//getEle 用来从本文档的第一个iframe中获取第一个element元素并插入到文档树中
function getEle() {
var iframe = document.getElementsByTagName("iframe")[0],
ele = iframe.contentWindow.document.body.firstElementChild
if(ele) {
document.body.appendChild(document.adoptNode(ele))
} else {
alert('没有更多元素啦')
}
}
document.getElementById('move').onclick = getEle
</script>
</body>
</html>
//iframe.html
<!DOCTYPE html>
<html>
<head>
<title>iframe.html</title>
</head>
<body>
<h1>Hello Dange</h1>
<h3>你好！丹哥</h3>
</body>
</html>
该方法不但可以从iframe中获取adopt元素，在同一document文档下的不同两个元素中也可以使用，该方法可以实现从左边栏列表中选取某些元素加载到右边栏的功能。（比如穿梭框功能）
由于这里是用js操作iframe，直接在浏览器打开文件，点击按钮之后会报错：Uncaught DOMException: Blocked a frame with origin "null" from accessing a cross-origin frame.
原因：在不同端口号下，不能使用传统的iframe嵌套调用方法。同源安全策略：能用javascript访问一个iframe，如果你能做到这一点，那将是一个巨大的安全缺陷。对于同一源策略浏览器，阻止脚本尝试访问具有不同源的帧。
如果要访问iframe，协议、主机名和端口必须与域相同。
示例运行方法--建立本地Node服务器访问文件
//server.js
var http = require('http');
var fs = require('fs');
//需要访问的文件存放目录
var documentRoot = 'D:/Users/dandanhu/Desktop/adoptNode';
var server = http.createServer(function(req, res) {
var url = req.url; //客户端输入的url，例如如果输入localhost:8888/index.html;那么这里的url == /index.html
var file = documentRoot + url;
console.log(file)
fs.readFile(file, function(err, data) {
/*
readFile
一参为文件路径
二参为回调函数
回调函数的一参为读取错误返回的信息，返回空就没有错误
二参为读取成功返回的文本内容
*/
if(err) {
res.writeHeader(404, {
'content-type' : 'text/html;charset="utf-8"'
});
res.write('<h1>404错误</h1><p>你要找的页面不存在</p>')
res.end()
} else {
res.writeHeader(200, {
'content-type' : 'text/html;charset="utf-8"'
});
res.write(data);//将index.html显示在客户端
res.end();
}
})
}).listen(8888);
console.log('服务器开启成功');
在当前目录下打开命令行工具，输入 node server启动服务器
浏览器中输入http://localhost:8888/adoptNode.html
就可以看到点击按钮，iframe中的内容移到外面啦~~~