impressionHtml=`<img src=${value} alt=""/>`;
 document.getElementById("wrapper").appendChild(impressionHtml);

js向父元素wrapper中的末尾添加 定义好的html,报错:

Uncaught TypeError: Failed to execute 'appendChild' on 'Node': parameter  is not of type 'Node'.

在stackoverflow上找到很好的一个解释:

所以js是不能直接传入字符串的,但是jquery的append可以直接传入html字符串。

js操作DOM在父元素中的结尾添加子节点注意的更多相关文章

  1. js操作DOM对象

    js操作DOM对象  (Document Object Model)文档对象模型 nodeType返回值 1:元素节点 2:属性节点 3:文本节点 8:注释节点 9: 文档节点 nodeName 节点 ...

  2. 原生js操作DOM基础-笔记

    原文参考http://mp.weixin.qq.com/s?__biz=MzU3MDA0NTMzMA==&mid=2247485490&idx=1&sn=15197b4b53e ...

  3. 【JavaScript实用技巧(二)】Js操作DOM(由问题引发的文章改版,新人大佬都可)

    [JavaScript实用技巧(二)]Js操作DOM(由问题引发的文章改版,新人大佬都可!) 博客说明 文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人 ...

  4. JS 操作 DOM

    定义:文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 节点:(例如:< ...

  5. 框架操作DOM和原生js操作DOM比较

    问题引出 对于Angular和React操作DOM的速度,和原生js操作DOM的速度进行了一个比较: 一个同学做的demo 代码如下: <!DOCTYPE html> <html n ...

  6. js与jquery获取父元素,删除子元素的不同方法

    var obj=document.getElementById("id");得到的是dom对象,对该对象进行操作的时候使用js方法 var obj=$("#id" ...

  7. 原生js操作Dom命令总结

    常用的dom方法 document.getElementById(“box”);//通过id获取标签    document.getElementsByTagName(“div”);根据标签名获取页面 ...

  8. 原生js操作Dom节点:CRUD

    知识点,依然会遗忘.我在思考到底是什么原因.想到研究生考试准备的那段岁月,想到知识体系的建立,知识体系分为正向知识体系和逆向知识体系:正向知识体系可以理解为教科书目录,逆向知识体系可以理解考试真题. ...

  9. ThinkPHP 表单提交操作成功后执行JS操作如何刷新父页面或关闭当前页等操作

    ThinkPHP 表单提交操作成功后执行JS操作如何刷新父页面或关闭当前页等操作 .操作成功后刷新父页面 $this->assign('jumpUrl', "javascript:wi ...

随机推荐

  1. Windows7的MySQL数据库的安装

    碰巧重装了系统,需要重新安装MySQL. 1.进入官网下载:https://dev.mysql.com/ 2.severonle 3.alt+n 4.alt+x

  2. centos7环境下对防火墙的操作

    我是运行了systemctl stop firewalld.service && systemctl disabl e firewalld.service命令于是显示 [root@in ...

  3. AFN和GCD并行同步问题

    链接: GCD 中组队列group与Afnetworking的结合使用 使用AFNetworking3.0实现接口异步并发 从并发编程到GCD浅述之一----任务.队列.线程复用.AFN3.0同步请求 ...

  4. vsftp安装与配置for Linux

    以Centos6中使用为例 1.安装 yum -y install vsftpd 2.基本配置 vi /etc/vsftpd/vsftpd.conf 匿名访问和切换根目录都会给服务器带来安全风险,我们 ...

  5. JDBC(5)—DatabaseMetaData

    1.简介: 使用元数据已实现通用的查询方法.元数据介绍:使用jdbc获得连接之后,得到一个Connection对象,可以通过这个对象获得DataBaseMetaData对象,该对象可以获得有关数据库管 ...

  6. Linux及MacOSX中使用zsh

    via : http://leochin.com/linux-macosx-shell-zsh/ Linux及MacOSX中使用zsh zsh是另一种Shell,类似bash,tcsh等等,只是多了一 ...

  7. C#中流的读写器BinaryReader、BinaryWriter,StreamReader、StreamWriter详解【转】

    https://blog.csdn.net/ymnl_gsh/article/details/80723050 C#的FileStream类提供了最原始的字节级上的文件读写功能,但我们习惯于对字符串操 ...

  8. C# SpinLock实现

    关于SpinLock自旋锁网上已经有很多说明,这里也copy了一部分,我这里主要关注微软的实现,学习人家的实现方式. 如果由于垃圾回收,基于对象的锁对象开销太高,可以使用SpinLock结构..NET ...

  9. IDEA下使用Maven的test命令乱码

    IDEA下使用Maven的test命令乱码的时候,加上 -Dfile.encoding=GBK 就可以解决啦   如下图所示:   或者在Maven的pom.xml文件中增加: <propert ...

  10. ELK菜鸟手记 (二) - 高级配置之多应用索引过滤

    我们在实际的场景中,经常是多个网站或者服务端在一台服务器上,但是如果这些应用全部 记录到一台logstash服务器,大家日志都混在一起不好区分. 有人说,我可以在日志中打项目名,但是这样并不方便. 其 ...