jQuery中prependTo()方法用法实例


Posted in Javascript onJanuary 08, 2015

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

此方法把匹配的元素插入指定元素之前。
prependTo()方法的作用和prepend()方法是相同的,但是在语法上是有差别的,虽然在形式上看起来是一样的。

语法结构:

$(selector).prependTo(content)

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

实例代码:

<!DOCTYPE html>

<html>

<head>

<meta charset=" utf-8">

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

<title>prependTo()函数-三水点靠木</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").prependTo("div");

})

})

</script>

</head>

<body>

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

<div>我是div</div>

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

</body>

</html>

注意:运行编辑器之后,再按F5刷新网页即可查看演示。
以上代码在点击按钮之后可以将p元素移动到div内部的前方。

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

Javascript 相关文章推荐
javascript优先加载笔记代码
Sep 30 Javascript
用户注册常用javascript代码
Aug 29 Javascript
Javascript 类与静态类的实现
Apr 01 Javascript
jQuery+CSS 半开折叠效果原理及代码(自写)
Mar 04 Javascript
鼠标滚轮改变图片大小的示例代码
Nov 20 Javascript
jQuery根据ID获取input、checkbox、radio、select的示例
Aug 11 Javascript
bootstrap table方法之expandRow-collapseRow展开或关闭当前行数据
Aug 09 Javascript
Node.js使用MySQL连接池的方法实例
Feb 11 Javascript
详解vue-cli 2.0配置文件(小结)
Jan 14 Javascript
Vue表单绑定的实例代码(单选按钮,选择框(单选时,多选时,用 v-for 渲染的动态选项)
May 13 Javascript
JavaScript字符和ASCII实现互相转换
Jun 03 Javascript
javascript实现雪花飘落效果
Aug 19 Javascript
8个超实用的jQuery功能代码分享
Jan 08 #Javascript
jQuery中appendTo()方法用法实例
Jan 08 #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
You might like
php之字符串变相相减的代码
2007/03/19 PHP
什么是MVC,好东西啊
2007/05/03 PHP
PHP+jQuery实现滚屏无刷新动态加载数据功能详解
2017/05/04 PHP
laravel-admin 实现给grid的列添加行数序号的方法
2019/10/08 PHP
js字符串转换成xml对象并使用技巧解读
2013/04/18 Javascript
让js弹出窗口居前显示的实现方法
2013/07/10 Javascript
jquery的attr方法禁用表单元素禁用输入内容
2014/06/23 Javascript
JavaScript动态添加style节点的方法
2015/06/09 Javascript
jQuery实现垂直半透明手风琴特效代码分享
2015/08/21 Javascript
Sublime Text 3常用插件及安装方法
2015/12/16 Javascript
jQuery实现下拉框左右移动(全部移动,已选移动)
2016/04/15 Javascript
浅谈js和css内联外联注意事项
2016/06/30 Javascript
基于Bootstrap实现下拉菜单项和表单导航条(两个菜单项,一个下拉菜单和登录表单导航条)
2016/07/22 Javascript
JS实现将Asp.Net的DateTime Json类型转换为标准时间的方法
2016/08/02 Javascript
关于数据与后端进行交流匹配(点亮星星)
2016/08/03 Javascript
NodeJS遍历文件生产文件列表功能示例
2017/01/22 NodeJs
vue axios post发送复杂对象问题
2019/06/04 Javascript
js 实现 list转换成tree的方法示例(数组到树)
2019/08/18 Javascript
在VUE中使用lodash的debounce和throttle操作
2020/11/09 Javascript
[46:02]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第二局
2016/02/28 DOTA
python使用Queue在多个子进程间交换数据的方法
2015/04/18 Python
讲解Python中的标识运算符
2015/05/14 Python
对pyqt5之menu和action的使用详解
2019/06/20 Python
python应用文件读取与登录注册功能
2019/09/23 Python
Python实现剪刀石头布小游戏(与电脑对战)
2019/12/31 Python
Python3爬虫发送请求的知识点实例
2020/07/30 Python
安装pyinstaller遇到的各种问题(小结)
2020/11/20 Python
CSS3实现瀑布流布局与无限加载图片相册的实例代码
2016/12/22 HTML / CSS
HTML5中的Scoped属性使用实例
2014/04/23 HTML / CSS
肯尼亚网上商城:Kilimall
2016/08/20 全球购物
EJB面试题
2015/07/28 面试题
个人考核材料
2014/05/15 职场文书
卡特教练观后感
2015/06/08 职场文书
小学生红领巾广播稿
2015/08/19 职场文书
选调生挂职锻炼工作总结
2015/10/23 职场文书
《植树问题》教学反思
2016/03/03 职场文书