jQuery 操作节点
1 原生js操作节点
先创建子节点,然后添加元素属性,最后追加到父节点中
//1 创建子节点
var aLink = document.createElement("a");
//2 添加属性
aLink.setAttribute("href","http//www.baidu.com");
aLink.setAttribute("target","_blank");
aLink.innerHYML = "百度一下";
//3 追加给父节点
document.getElementById("fater").appendChild(aLink);
2 jquery 动态创建属性
//第一种 prepend()表示在开头添加 append() 表示在末尾添加
$(".box").append('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
$(".box").prepend('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
//第二种
var $a = $('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
$(".box").append($a);
$(".box").prepend($a);
//第三种, 给元素添加兄弟节点
$(selected).after(element)-------->>在元素后面添加节点
$(selected).before(element);------>>在元素前面添加节点
$(".box").before($a);
$(".box").after($a);
3 节点复制 clone()或clone(false)等价 表示不复制事件
clone(true) 深度复制 会复制事件
$("div").append($(".outer").clone(true));
1 原生js操作节点
先创建子节点,然后添加元素属性,最后追加到父节点中
//1 创建子节点
var aLink = document.createElement("a");
//2 添加属性
aLink.setAttribute("href","http//www.baidu.com");
aLink.setAttribute("target","_blank");
aLink.innerHYML = "百度一下";
//3 追加给父节点
document.getElementById("fater").appendChild(aLink);
2 jquery 动态创建属性
//第一种 prepend()表示在开头添加 append() 表示在末尾添加
$(".box").append('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
$(".box").prepend('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
//第二种
var $a = $('<a href="http://www.baidu.com" target="_blank">百度一下</a>');
$(".box").append($a);
$(".box").prepend($a);
//第三种, 给元素添加兄弟节点
$(selected).after(element)-------->>在元素后面添加节点
$(selected).before(element);------>>在元素前面添加节点
$(".box").before($a);
$(".box").after($a);
3 节点复制 clone()或clone(false)等价 表示不复制事件
clone(true) 深度复制 会复制事件
$("div").append($(".outer").clone(true));