jQuery HTML- 添加元素
添加内容
html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jquery</title>
<script type="text/javascript" src="js/jquery-3.0.0.min.js"></script>
<script type="text/javascript" src="js/try.js" ></script>
</head>
<body>
<p id="p1">hello</p>
<button id="btn1">点击</button>
<p id="p2">world</p>
<button id="btn2">点击</button> <p id="p3">world</p>
<button id="btn3">点击</button>
<p id="p4">world</p> <button id="btn4">点击</button>
</body>
</html>
js
$(document).ready(function(){
$("#btn1").click(function(){
$("#p1").append(" world");
});
$("#btn2").click(function(){
$("#p2").prepend("hello ");
});
$("#btn3").click(function(){
$("#p3").before("hello ");
});
$("#btn4").click(function(){
$("#p4").after("hello ");
});
});
效果:
2017-09-21 17:29:21
jQuery HTML- 添加元素的更多相关文章
- jquery动态添加元素无法触发绑定事件的解决方案。
jquery动态添加元素无法触发绑定的事件的解决方案. ╭(●｀∀´●)╯二狗最近在工作中遇到一个问题,即当用jquery动态添加元素后,发现给动态添加的元素却无法触发事件(╯#-_-)╯╧═╧ ( ...
- jQuery动态添加元素事件
在项目中遇到需要jQuery动态添加元素的事件,做了一个demo,方便以后遇到相同的问题可以用上: <!DOCTYPE html> <html> <head> &l ...
- jquery中添加元素append，prepend，before和after方法的区别
append:在元素内部的最后面添加元素,作为子元素. prepend:在元素内部的最前面添加元素,作为子元素. before:在元素的前边,作为兄弟元素添加. after:在元素的后边,作为兄弟元素 ...
- jquery动态添加元素无法触发绑定的事件的解决方案
方法一:绑定live事件(live事件只在jquery1.9以下才支持,高版本不支持). //jquery 1.9(不包括1.9)以下可以 $(".btn").live(" ...
- jQuery 新添加元素事件绑定无效
jQuery中事件绑定,大多使用on就足够了. 但是对于新添加的元素 on 的绑定事件 会不起作用. 因为 append 中的 节点是在整个文档加载之后才添加的,页面并不会为未来的元素初始化添加点击事 ...
- Jquery动态添加元素并给元素增加onchange相应
动态添加元素: $select = $("<select></select>"); $("<option></option> ...
- jQuery动态添加元素,并提交json格式数据到后台
参考:https://www.cnblogs.com/shj-com/p/7878727.html 下载 下载该插件的地址是:http://www.bootcdn.cn/jquery.serializ ...
- jQuery动态添加元素并绑定事件
写网页的时候常常需要根据实际情况添加新的元素,然后这些新元素还需要绑定已有的事件,如:有一ul,点击其中某 li,根据其 id 或 value 等获取新的数据列表,并新建 ul 显示,新 ul 中的 ...
- jquery新添加元素无法删除
$("body").on('click',".delic",function(){ $(this).parent().remove(); })
- Jquery 动态添加元素后，获取不到元素对象情况
随机推荐
- day17 python re模块 简易爬虫
day17 python 一.re模块 1.re模块的基础方法 查找findall() import re #re.findall(pattern,string,flags ...
- bzoj1004 [HNOI2008]Cards Burnside 引理+背包
题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=1004 题解 直接 Burnside 引理就可以了. 要计算不动点的个数,那么对于一个长度为 \ ...
- python基础：3.高级运算符
1.异或运算 十进制的异或运算,先转成二进制进行异或,按位进行比较,对应位置相同则为0,对应位置不同则为1,,再从异或结果转成十进制. python中: 1 ^ 1 = 0 1 ^ 2 = 3 1 ^ ...
- springMVC的controller更改了，如何不重启，而自动刷新的解决办法（亲测，一招解决）
Tomcat con/ service.xml 配置如下一行代码: <Context reloadable="true"/> </Host> 然后以de ...
- Git 如何删除分支
- CSP-S2019退役记/爆内存记
DAY 0 准备出发. 出发前教练说遇到事不慌,打电话,又听教练说了说历年赶车经历. 然后这趟路上居然没有什么大事. 在车上有些闲,于是就和其他人聊了会天,聊着聊着没意思,就用手机翻博客园. 这样就不 ...
- 【HDOJ6608】Fansblog（威尔逊定理）
题意:给定质数p,求q!模p的值,其中q为小于p的最大质数 1e9<=p<=1e14 思路:根据质数密度近似分布可以暴力找q并检查 找到q后根据威尔逊定理: 把q+1到p-1这一段的逆元移 ...
- vue开发微信公众号--开发准备
由于工作项目的原因,需要使用vue开发微信公众号,但是这种微信公众号更多是将APP套了一个微信的壳子,除了前面的授权和微信有关系以外,其他的都和微信没多大的关系了,特此记录 开发流程 首先需要在电脑上 ...
- error C2065: “CString”: 未声明的标识符 ；fatal error C1189: #error : afxstr.h can only be used in MFC proje
转自VC错误:http://www.vcerror.com/?p=1388 问题描述: error C2065: "CString": 未声明的标识符 fatal error C1 ...
- apm 应用性能管理(启动优化/ 掉帧卡顿/ 耗电/ 内存泄漏等)
APM 首先查看各个阶段耗时 : (环境变量设置 dyldPRINTSTATISTICS = 1选项,) 1. 启动优化 关键: 找到耗时的原因 t总 = t1 (premain) + t1(main ...