jQuery中appendTo()方法用法实例


Posted in Javascript onJanuary 08, 2015

本文实例讲述了jQuery中appendTo()方法用法。分享给大家供大家参考。具体分析如下:

此方法把匹配的元素插入指定元素结尾,插入位置在元素的内部。
appendTo()方法的作用和append()方法是相同的,但是语法是不同的,尽管形式一样。

语法结构:

$(selector).appendTo(content)

参数列表:
参数 描述
selector 要被插入的匹配元素。
content 要被插入匹配元素的元素。

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="https://3water.com/" />

<title>appendTo()函数-三水点靠木</title>

<style type="text/css">

p{

  height:100px;

  width:100px;

  border:1px solid blue;

}

div{

  height:200px;

  width:200px;

  border:1px solid green;

}

</style>

<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>

<script type="text/javascript">

$(document).ready(function(){

  $("button").click(function(){

    $("p").appendTo("div");

  })

})

</script>

</head>

<body>

<p>我是p的内容</p>

<div>我是div</div>

<button>点击查看效果</button>

</body>

</html>

以上代码中,当点击按钮的时候,能够将p元素移动到div元素的内部的尾部。

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
Javascript中的Split使用方法与技巧
Mar 09 Javascript
jquery判断单个复选框是否被选中的代码
Sep 03 Javascript
javascript中声明函数的方法及调用函数的返回值
Jul 22 Javascript
JavaScript、tab切换完整版(自动切换、鼠标移入停止、移开运行)
Jan 05 Javascript
jquery中的常见问题及快速解决方法小结
Jun 14 Javascript
JavaScript对象引用与赋值实例详解
Mar 15 Javascript
微信小程序 连续旋转动画(this.animation.rotate)详解
Apr 07 Javascript
AngularJS实现select的ng-options功能示例
Jul 12 Javascript
jquery写出PC端轮播图实例
Jan 26 jQuery
实例分析JS中的相等性判断===、 ==和Object.is()
Nov 17 Javascript
js实现左右轮播图
Jan 09 Javascript
ES2020 已定稿,真实场景案例分析
May 25 Javascript
jQuery中append()方法用法实例
Jan 08 #Javascript
jQuery中end()方法用法实例
Jan 08 #Javascript
jQuery中contents()方法用法实例
Jan 08 #Javascript
jQuery中andSelf()方法用法实例
Jan 08 #Javascript
jQuery中add()方法用法实例
Jan 08 #Javascript
javascript 动态创建表格
Jan 08 #Javascript
javascript实现避免页面按钮重复提交
Jan 08 #Javascript
You might like
FCKeditor的安装(PHP)
2007/01/13 PHP
php将fileterms函数返回的结果变成可读的形式
2011/04/21 PHP
PHP取整函数:ceil,floor,round,intval的区别详细解析
2013/08/31 PHP
利用Fix Rss Feeds插件修复WordPress的Feed显示错误
2015/12/19 PHP
php基于环形链表解决约瑟夫环问题示例
2017/11/07 PHP
jsTree树控件(基于jQuery, 超强悍)[推荐]
2009/09/01 Javascript
Jquery 绑定时间实现代码
2011/05/03 Javascript
JS定时刷新页面及跳转页面的方法
2013/07/04 Javascript
nodejs爬虫抓取数据之编码问题
2015/07/03 NodeJs
基于cookie实现zTree树刷新后展开状态不变
2017/02/28 Javascript
vue动态生成dom并且自动绑定事件
2017/04/19 Javascript
微信小程序 同步请求授权的详解
2017/08/04 Javascript
jQuery Ajax 实现分页 kkpager插件实例代码
2017/08/10 jQuery
layui checkbox默认选中,获取选中值,清空所有选中项的例子
2019/09/02 Javascript
JS删除数组指定值常用方法详解
2020/06/04 Javascript
vue2.0 解决抽取公用js的问题
2020/07/31 Javascript
three.js如何实现3D动态文字效果
2021/03/03 Javascript
动态创建类实例代码
2009/10/07 Python
跟老齐学Python之类的细节
2014/10/13 Python
在Python中封装GObject模块进行图形化程序编程的教程
2015/04/14 Python
使用python批量化音乐文件格式转换的实例
2019/01/09 Python
python爬虫增加访问量的方法
2019/08/22 Python
Python Gitlab Api 使用方法
2019/08/28 Python
Python闭包与装饰器原理及实例解析
2020/04/30 Python
英国最大的自有市场,比亚马逊便宜:Flubit
2019/03/19 全球购物
运动会跳远广播稿
2014/02/04 职场文书
医院总经理岗位职责
2014/02/04 职场文书
小学生清明节演讲稿
2014/09/05 职场文书
法定代表人资格证明书
2014/09/11 职场文书
考试作弊检讨
2015/01/27 职场文书
责任书格式
2015/01/29 职场文书
邀请函模板
2015/02/02 职场文书
慰问信范文
2015/02/14 职场文书
2015毕业生自我评价范文
2015/03/02 职场文书
家长通知书家长意见
2015/06/03 职场文书
Django数据库(SQlite)基本入门使用教程
2022/07/07 Python