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. php integer

    一.整数的表示方法: 整型值可以使用十进制,十六进制,八进制或二进制表示,前面可以加上可选的符号(- 或者 +) 要使用二进制表达,数字前必须加上 0b 要使用八进制表达,数字前必须加上 0. 要使用 ...

  2. 2d场景背景无限滚动

    之前都是直接借用的DoTween插件,两个背景无限交替位置进行,还有就是三个背景在利用Trigger进行判断显示与否循环: 示例脚本: private List<RectTransform> ...

  3. exited abnormally with signal 11: Segmentation fault 的相关处理

    前一阵子遇到一个问题,程序打包后,在某个界面总是崩溃,device log只打印了exited abnormally with signal 11: Segmentation fault 网上找了下相 ...

  4. Chart-template

    ylbtech-Chart: 1.返回顶部 1-1. 2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   7.返回顶部   8.返回顶部   9.返回顶部   ...

  5. inet_ntoa内存问题

    最近写的一个程序,大致用到以下代码: WSADATA wsaData; WSAStartup (MAKEWORD( 2, 2 ),&wsaData); struct addrinfo *aiL ...

  6. 转载-vim配置收藏

    转载自:http://www.cnblogs.com/ma6174/archive/2011/12/10/2283393.html 1.按F5可以直接编译并执行C.C++.java代码以及执行shel ...

  7. 【CSS Demo】网站页面变灰

    让网站所有元素变成灰色调,全浏览器支持,使用了滤镜,比较吃性能,建议作临时方案使用. 实现效果(点击下面的按钮): 这里放一张图片作为效果展示: 其CSS代码如下: body{ -webkit-fil ...

  8. Ubuntu上安装git和创建工作区和提交文件！！！

    1.安装git: sudo apt-get install git 2.创建工作区: 创建一个文件夹,sudo mkdir 文件文件夹.告诉git这是个工作区文件夹,sudo git init 文件夹 ...

  9. Word批量删除所有书签

    Word中的书签功能可快速.准确定位文档中特定的位置,经常用于模板定制.文档产出等. 可一直以来,书签功能存在一个不便的操作,即无法批量删除,只能单个删除,操作极不友好. 解决方案 我用代码暂时还改变 ...

  10. 在Linux平台上搭建EasyDarwin，编译代码并简单部署

    測试环境: Ubuntu gcc / g++ 从https://github.com/EasyDarwin/EasyDarwin下载代码 1.编译 第一步:进入源码文件夹下 cd ./EasyDarw ...