var fragment = document.createDocumentFragment();
li = document.createElement('li');
li.className = "xxx";
fragment.appendChild(li);
document.getElementById("xx").appendChild(fragment);
如上,须要先原生创建节点,节点内容成为了document的一部分才干appendchild。
假设直接  appendchild(“<div></div>”)是不能够的。
由于appendChild(Node)这个 方法通常是在指定元素节点的最后一个子节点之后加入节点 
但假设Node是页面中的DOM对象,那么就不是加入节点了,就是直接Move节点。 
appendChild你能够理解为移动一个元素。假设想复制一份过去,要事先clone 
可是无论如何,这个node须要先存在。
append()前面是要选择的对象,后面是要在对象内插入的元素内容 

appendTo()前面是要插入的元素内容且为Jquery对象。而后面是要选择的对象

实例:

$('#a').append('content');
$('<div>content</div>').appendTo($('#a')); //注意appendTo前面一定要是Jquery对象。

纯属个人观点。有误希望大家指点,谢谢

JS原生追加子节点的更多相关文章

  1. JS之获取子节点

    在JS中获取子节点有以下几种方法: firstElementChild.firstChild.childNodes和children 我们通过一个例子来分析这几种方法的区别(获取div下的p标签) 输 ...

  2. JavaScript DOM查询,原生js实现元素子节点的获取

    在网页网页开发中,经常会需要获取某个网页元素的子元素,然后对其进行事件绑定.或样式修改等行为.这些操作对于jquery来说很容易,但是对于原生js会稍微麻烦一些,这里将介绍四种方法获取元素的子元素(本 ...

  3. js 递归获取子节点所有父节点,深度遍历获取第一个子树

    前端需求. 递归 深度优先遍历算法 // 查找一个节点的所有父节点 familyTree (arr1, id) { var temp = [] var forFn = function (arr, i ...

  4. JS 查找遍历子节点元素

    function nextChildNode(node,clazz,tagName){ var count= node.childElementCount; for(var i=0;i<coun ...

  5. 总结获取原生JS(javascript)的父节点、子节点、兄弟节点

    关于原生JS获取节点,一直是个头疼的问题,而且调用方法的名字又贼长了,所以我选择用JQ,好像跑题了-- 话不多说看代码 获取父节点 及 父节点下所有子节点(兄弟节点) <ul> <l ...

  6. JS和jQuery获取节点的兄弟,父级,子级元素

    原文转自http://blog.csdn.net/duanshuyong/article/details/7562423 先说一下JS的获取方法,其要比JQUERY的方法麻烦很多,后面以JQUERY的 ...

  7. 通过JS动态追加标签,以父评论子评论为例

    以下代码前后端交互以Django模板语法为例 先来以伪代码来示意用法: HTML部分: JS动态插入部分代码: 运行之后我们来浏览器看检查打印的内容: 看插入前后打印结果我们可以得知 $title[0 ...

  8. 原生js快速渲染dom节点

    function renderDom(str){ var _div = document.createElement('div'); _div.innerHTML = str; var dom_tem ...

  9. js遍历 子节点 子元素

    Js 节点 子元素 属性 方法 // 添加子节点前 删除所有子节点 var usernameEle = document.getElementById("username"); v ...

随机推荐

  1. Solution of NumberOfDiscIntersections by Codility

    question:https://codility.com/programmers/lessons/4 this question is seem like line intersections qu ...

  2. Node.js meitulu图片批量下载爬虫1.03版

    //====================================================== // https://www.meitulu.com图片批量下载Node.js爬虫1. ...

  3. html5学习整理-0311

    整理一下今天所学的一些标签内容. 首先说一下DNS:全称Domain Name System,域名系统.是因特网上作为域名和IP地址相互映射的一个分布式数据库. URL协议:规定URL地址的格式,UR ...

  4. 适用于 Charles任 意版 本的 注 册 码

    // Charles Proxy License // 适用于Charles任意版本的注册码,谁还会想要使用破解版呢. // Charles 4.2目前是最新版,可用. Registered Name ...

  5. Hadoop之词频统计小实验

    声明:    1)本文由我原创撰写,转载时请注明出处,侵权必究. 2)本小实验工作环境为Ubuntu操作系统,hadoop1-2-1,jdk1.8.0. 3)统计词频工作在单节点的伪分布上,至于真正实 ...

  6. android 类似微信的摇一摇实现

    一.在 AndroidManifest.xml 中添加操作权限 <uses-permission android:name="android.permission.VIBRATE&qu ...

  7. 程序员取悦女票的正确姿势---Tip1(iOS美容篇)

    代码地址如下:http://www.demodashi.com/demo/11695.html 前言 女孩子都喜欢用美图工具进行图片美容,近来无事时,特意为某人写了个自定义图片滤镜生成器,安装到手机即 ...

  8. 编写C函数的技术-《lua程序设计》 27章 学习

    1.数组操作 void lua_rawgeti(lua_State * L ,int index,int key) void lua_rewseti(lua_State * L,int index,i ...

  9. UnicodeEncodeError: ‘gbk’ codec can’t encode character u’\u200e’ in position 43: illegal multibyte sequence

    [问题] python中已获取网页: http://blog.csdn.net/hfahe/article/details/5494895 的html源码,其时UTF-8编码的. 提取出其标题部分: ...

  10. MySQL性能监控工具-Spotlight on MySQL

    原文地址:http://blog.csdn.net/k_scott/article/details/8167018 这是我的第二款用于监控MySQL数据库性能的工具:Spotlight on MySQ ...