1. /**
  2. * javascrit原生实现jquery的append()函数
  3. * @param parent
  4. * @param text
  5. */
  6. function append(parent, text) {
  7. if (typeof text === 'string') {
  8. var temp = document.createElement('div');
  9. temp.innerHTML = text;
  10. // 防止元素太多 进行提速
  11. var frag = document.createDocumentFragment();
  12. while (temp.firstChild) {
  13. frag.appendChild(temp.firstChild);
  14. }
  15. parent.appendChild(frag);
  16. }
  17. else {
  18. parent.appendChild(text);
  19. }
  20. }
  21.  
  22. // 用法
  1. var html = buildMenu(menuList);
    var menuUl = document.getElementById("ul");
    var html = '<li>...</li>';
    append(menuUl, html);
  1.  

javascrit原生实现jquery的append()函数的更多相关文章

  1. 【JavaScript框架封装】在实现一个自己定义类似于JQuery的append()函数的时候遇到的问题及解决方案

    主要问题: 在刚开始创建了这个函数之后,使用的时候,总是会出现一个问题,就是按照正常步骤给一个ID选择器添加子节点的时候正常,但是到了给一个class选择器的元素添加的时候始终只能添加一个. 下面是我 ...

  2. jquery after append appendTo三个函数的区别

    jq文档的说明是 1.after函数 定义和用法: after() 方法在被选元素后插入指定的内容. 语法: $(selector).after(content) 实例: <html> & ...

  3. 【转】jQuery on()选择器函数

    on()函数用于为指定元素的一个或多个事件绑定事件处理函数. 此外,你还可以额外传递给事件处理函数一些所需的数据. 从jQuery 1.7开始,on()函数提供了绑定事件处理程序所需的所有功能,用于统 ...

  4. 使用jquery的append(content)方法的注意事项

    append(content)函数:向每个匹配的元素内部追加内容. 如以下示例: 向所有段落中追加一些HTML标记. HTML 代码: <p>I would like to say: &l ...

  5. 图片轮播(左右切换)--JS原生和jQuery实现

    图片轮播(左右切换)--js原生和jquery实现 左右切换的做法基本步骤跟 上一篇文章  淡入淡出 类似,只不过修改了一些特定的部分 (1)首先是页面的结构部分 对于我这种左右切换式 1.首先是个外 ...

  6. 图片轮播(淡入淡出)--JS原生和jQuery实现

    图片轮播(淡入淡出)--js原生和jquery实现 图片轮播有很多种方式,这里采用其中的 淡入淡出形式 js原生和jQuery都可以实现,jquery因为封装了很多用法,所以用起来就简单许多,转换成j ...

  7. jQuery1.11源码分析(9)-----初始化jQuery对象的函数和关联节点获取函数

    这篇也没什么好说的,初始化jQuery对象的函数要处理多种情况,已经被寒冬吐槽烂了.关联节点获取函数主要基于两个工具函数dir和sibling,前者基于指定的方向遍历,后者则遍历兄弟节点(真的不能合并 ...

  8. jQuery中append()与appendto()用法分析

    本文实例分析了jquery中append()与appendto()的用法.分享给大家供大家参考.具体分析如下: 在jQuery的文档操作方法中,append()和appentto()方法执行的任务相同 ...

  9. [总结]jQuery之常用函数方法参考手册

    w3school参考地址:http://www.w3school.com.cn/jquery/index.asp runoob参考地址:http://www.runoob.com/jquery/jqu ...

随机推荐

  1. .Net Core Logger 实现log写入本地文件系统

    .net core 自带一个基础的logger框架Microsoft.Extensions.Logging. 微软默认实现了Microsoft.Extensions.Logging.Console.d ...

  2. 递推 hdu 1330

    http://www.cnblogs.com/rainydays/archive/2013/01/16/2862235.html 看样例的答案 #include<stdio.h> #inc ...

  3. python笔记

    # coding=utf-8 定义后可使用中文#var定义输出i=1print(i)#ifif i>0: print(i)else: print("x")#循环+字符串拼接f ...

  4. js中this关键字测试集锦

    参考:阮一峰<javascript的this用法>及<JS中this关键字详解> this是Javascript语言的一个关键字它代表函数运行时,自动生成的一个内部对象,只能在 ...

  5. Android ooVoo Apk附件关联分析

    为什么要分析附件关联 发送和接收的图片以及头像等从网上下载的存储在手机的sdcard上面以转换后的名字命名,需要分析数据库中的记录所对应的sdcard的文件才能关联.比如数据库存储是http://oo ...

  6. TCP/IP中链路层的附加数据(Trailer数据)和作用

    1.TCP/IP中链路层的附加数据是什么 在用wireshark打开报文时,链路层显示的Trailer数据就是附加数据,如图 2.如何产生 1.例如以太网自动对小于64字节大小的报文进行填充(未实验) ...

  7. BZOJ2588: Spoj 10628. Count on a tree

    传送门 刚开始看错题以为是dfs序瞎搞.. 后来看清题了开始想用树剖瞎搞... 感觉要滚粗啊.. 对于每个点到根的路径建立线段树,暴力建MLE没跑,上主席树,然后$(x,y)$的路径就可以先求出来$L ...

  8. php获得远程信息到本地使用的3个函数:file_get_contents和curl函数和stream_get_contents

    1:file_get_contents echo file_get_contents("http://www.php.com/index.php");   2:curl funct ...

  9. 使用strings查看二进制文件中的字符串

    使用strings查看二进制文件中的字符串 今天介绍的这个小工具叫做strings,它实现功能很简单,就是找出文件内容中的可打印字符串.所谓可打印字符串的涵义是,它的组成部分都是可打印字符,并且以nu ...

  10. Ubuntu14.04安装python3.5

    Ubuntu14.04系统会自带python2.7,请不要卸载它,不同版本的Python可以共存. #sudo add-apt-repository ppa:fkrull/deadsnakes #su ...