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()、join()、substring()和indexOf()
Jun 02 Javascript
css配合jquery美化 select
Nov 29 Javascript
JS中Date日期函数中的参数使用介绍
Jan 02 Javascript
通过pjax实现无刷新翻页(兼容新版jquery)
Jan 31 Javascript
通过Javascript读取本地Excel文件内容的代码示例
Apr 08 Javascript
JS实现在状态栏显示打字效果完整实例
Nov 02 Javascript
javascript基本语法
May 31 Javascript
JQuery为元素添加样式的实现方法
Jul 20 Javascript
强大的JavaScript响应式图表Chartist.js的使用
Sep 13 Javascript
vue-cli中使用高德地图的方法示例
Mar 28 Javascript
LayUI动态设置checkbox不显示的解决方法
Sep 02 Javascript
Vue中使用Lodop插件实现打印功能的简单方法
Dec 19 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
php环境配置 php5 mysql5 apache2 phpmyadmin安装与配置
2006/11/17 PHP
php 高性能书写
2010/12/11 PHP
jQuery中fadeOut()方法用法实例
2014/12/24 Javascript
jQuery实现菜单感应鼠标滑动动画效果的方法
2015/02/28 Javascript
纯js实现手风琴效果
2020/04/17 Javascript
JQuery解析XML数据的几个简单实例
2016/05/18 Javascript
Jquery鼠标放上去显示全名的实现方法
2017/02/06 Javascript
JS优化与惰性载入函数实例分析
2017/04/06 Javascript
老生常谈Bootstrap媒体对象
2017/07/06 Javascript
vue使用axios跨域请求数据问题详解
2017/10/18 Javascript
最新Javascript程序员面试试题和解题方法
2017/11/23 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
简单理解Vue中的nextTick方法
2018/01/30 Javascript
JS调用安卓手机摄像头扫描二维码
2018/10/16 Javascript
JavaScript 中 JSON.parse 函数 和 JSON.stringify 函数
2018/12/05 Javascript
JavaScript实现滑动门效果
2020/01/18 Javascript
js实现超级玛丽小游戏
2020/03/18 Javascript
es6数组之扩展运算符操作实例分析
2020/04/25 Javascript
Vue 解决通过this.$refs来获取DOM或者组件报错问题
2020/07/28 Javascript
three.js 如何制作魔方
2020/07/31 Javascript
JavaScript ES 模块的使用
2020/11/12 Javascript
python函数局部变量用法实例分析
2015/08/04 Python
用 Python 爬了爬自己的微信朋友(实例讲解)
2017/08/25 Python
python判断计算机是否有网络连接的实例
2018/12/15 Python
Python Django 添加首页尾页上一页下一页代码实例
2019/08/21 Python
python爬虫开发之Beautiful Soup模块从安装到详细使用方法与实例
2020/03/09 Python
Python 数据的累加与统计的示例代码
2020/08/03 Python
教你使用Canvas处理图片的方法
2017/11/28 HTML / CSS
澳大利亚领先的睡衣品牌:Peter Alexander
2016/08/16 全球购物
NICKIS.com荷兰:设计师儿童时装
2020/01/08 全球购物
医药个人求职信范文
2014/01/29 职场文书
负责人任命书范本
2014/06/04 职场文书
签证工作证明模板
2015/06/15 职场文书
python执行js代码的方法
2021/05/13 Python
Spring Boot 实现敏感词及特殊字符过滤处理
2021/06/29 Java/Android
欧元符号 €
2022/02/17 杂记