今天在写dome的时候,碰到了一小点问题,就是我们想把一个小效果用jquery的办法添加到HTML页面中。我用的办法就是先在HTML中把代码写完,js和css同样写好并调试完成后。然后只保存外面最大的盒子,保证jq能找到代码的插入位置。然后把代码复制到js文件中,采用字符串拼接的方式,请看下面的代码:

 var str='<div class="cen1">1</div>'+
'<div class="cen2">2</div>'+
'<div class="cen3">3</div>'+
'<div class="cen4">4</div>'+
'<div class="cen5">5</div>';

这里就拼接好了一个str。然后我就把str插入到了HTMl中,用的是这条语句:

$('#box').append(str);//ID名为box的是个大盒子

这样就完成了。但是写完后突然想到了append的兄弟,appendTo。我就手贱的写成了这样:

str.appendTo($('#box'));

结果浏览器就开始报错了:

Uncaught TypeError: str.appendTo is not a function
at 2.html:34

怎么报错了呢,在我的印象中appenTo和append不就是位置不同吗,没什么区别啊。但是仔细的看了一下报错,突然明白了。str只是个字符串变量,一个普通的变量怎么能用“.”方法呢,这肯定是不对的。所以这里也就只能用append了。所以在这里给自己提个醒,也请大家注意!

append和appendTo的区别!的更多相关文章

  1. JQuery之append和appendTo的区别,还有js中的appendChild用法

    JQuery之append和appendTo的区别 append()前面是要选择的对象,后面是要在对象内插入的元素内容 appendTo()前面是要插入的元素内容且为Jquery对象,而后面是要选择的 ...

  2. jQ函数after、append、appendTo的区别

    1.after函数定义和用法:after() 方法在被选元素后插入指定的内容.参考:http://keleyi.com/a/bjac/cfyxd60g.htm 语法:$(selector).after ...

  3. jQuery中append()与appendTo()方法区别

    1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...

  4. jquery中 append 和appendto的区别

    1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...

  5. jquery中append与appendTo方法区别

    1. append(content)方法 方法作用:向每个匹配的元素内部追加内容. 参数介绍:content (<Content>): 要追加到目标中的内容. 用法示例: HTML代码为& ...

  6. append appendChild appendTo区别

    1.append和appendChild的区别 append是jquery文档操作用法 ① append() 方法在被选元素的结尾(仍然在内部)插入指定内容. $(selector).append(c ...

  7. 【笔记】jquery append,appendTo,prepend,prependTo 介绍

    在jquery权威指南里面学习到这一章,很有必要介绍一下里面的内容: 首先是append(content)这个函数: 意思是将内容content加入到所选择的对象内容的后面 例如:$("di ...

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

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

  9. jquery append 和appendTo

    原文: https://www.cnblogs.com/stitchgogo/p/5721551.html ---------------------------------------------- ...

随机推荐

  1. java 的基本数据类型及转换

    数据类型精度: byte 8 位short 16 位int 32 位long 64 位float 32 位double 64 位char 16 位 boolean 占几位要看 jvm 的具体实现, 虽 ...

  2. NFS部署文件共享

    本章解了如何配置网络文件系统(Network File System,NFS)服务来简化Linux系统之间的文件共享工作,以及通过部署NFS服务在多台Linux系统之间挂载并使用资源.在管理设备挂载信 ...

  3. [Swift]LeetCode25. k个一组翻转链表 | Reverse Nodes in k-Group

    Given a linked list, reverse the nodes of a linked list k at a time and return its modified list. k  ...

  4. [Swift]LeetCode241. 为运算表达式设计优先级 | Different Ways to Add Parentheses

    Given a string of numbers and operators, return all possible results from computing all the differen ...

  5. [Swift]LeetCode787. K 站中转内最便宜的航班 | Cheapest Flights Within K Stops

    There are n cities connected by m flights. Each fight starts from city u and arrives at v with a pri ...

  6. [Swift]LeetCode939. 最小面积矩形 | Minimum Area Rectangle

    Given a set of points in the xy-plane, determine the minimum area of a rectangle formed from these p ...

  7. pycharm(Python编辑器)的激活

    1.将“0.0.0.0 account.jetbrains.com”中的内容添加到hosts文件中,hosts路径为:C:\Windows\System32\drivers\etc mac用户的hos ...

  8. Python 创建递归文件夹

    # 创建递归文件夹 def createfiles(filepathname): try: os.makedirs(filepathname) except Exception as err: pri ...

  9. Python内置函数(40)——map

    英文文档: map(function, iterable, ...) Return an iterator that applies function to every item of iterabl ...

  10. BBS论坛(二十二)

    22.1.七牛js上传轮播图图片 (1)common/zlqiniu.js 'use strict'; var zlqiniu = { 'setup': function (args) { var d ...