jQuery添加和删除元素
添加新的 HTML 内容
我们将学习用于添加新内容的四个 jQuery 方法:
- append() - 在被选元素的结尾插入内容
- prepend() - 在被选元素的开头插入内容
- after() - 在被选元素之后插入内容
- before() - 在被选元素之前插入内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js">
</script>
<script>
$(document).ready(function(){
var i = 0;
$("#btn1").click(function(){
i ++ ;
$("p").append("<b>" + i + "</b>" + " ");
}); $("#btn2").click(function(){
$("ol").append("<li>添加列表</li>");
});
});
</script>
</head> <body>
<p>Number:</p>
<ol>
<li>List item 1</li>
<li>List item 2</li>
<li>List item 3</li>
</ol>
<button id="btn1">添加文本数字</button>
<button id="btn2">添加列表项</button>
<hr>
<button onclick="appendText()">追加文本</button>
</body> <script>
function appendText(){
var txt1="<b>文本------</b>"; // 使用 HTML 标签创建文本
var txt2=$("<u></u>").text("文本-----"); // 使用 jQuery 创建文本
var txt3=document.createElement("i");
txt3.innerHTML="文本。"; // 使用 DOM 创建文本 text with DOM
$("body").append(txt1,txt2,txt3); // 追加新元素
}
</script>
</html>
jQuery添加和删除元素的更多相关文章
- JQUERY添加、删除元素、eq()方法;
一.jQuery - 添加元素 1.append() - 在被选元素内部的结尾插入指定内容 2.prepend() - 在被选元素内部的开头插入指定内容 3.after() - 在被选元素之后插入内容 ...
- jquery 添加与删除的规律 当要添加时候要定位到自己的父元素 当要删除时候 通过事件函数传入的this找到自己的父元素进行删除
jquery 添加与删除的规律 当要添加时候要定位到自己的父元素 当要删除时候 通过事件函数传入的this找到自己的父元素进行删除
- 第二十四篇 jQuery 学习6 删除元素
jQuery 学习6 删除元素 上节课我们做了添加元素,模拟的是楼主发的文章,路人评论,那么同学们这节课学了删除之后,去之前的代码上添加一个删除,模拟一个楼主删除路人的评论. jQuery的删除方 ...
- Arrays.asList () 不可添加或删除元素的原因
Java中奖数组转换为List<T>容器有一个很方便的方法 Arrays.asList(T ... a),我通过此方法给容器进行了赋值操作,接着对其进行 添加元素,却发现会抛出一个(jav ...
- JavaScript向select下拉框中添加和删除元素
JavaScript向select下拉框中添加和删除元素 1.说明 a 利用append()方法向下拉框中添加元素 b 利用remove()方法移除下拉框中最后一个元素 2.设计源码 < ...
- 使用jQuery增加或删除元素(内容)
使用jQuery增加或删除元素(内容):一.jQuery添加元素或内容:1,append() 方法:在被选元素的结尾插入元素或内容 2,prepend() 方法:被选元素的开头插入元素或内容. 3,a ...
- js进阶 9-11 select选项框如何动态添加和删除元素
js进阶 9-11 select选项框如何动态添加和删除元素 一.总结 一句话总结: 二.js进阶 9-11 select选项框如何动态添加和删除元素 1.案例说明 2.相关知识 Select 下拉列 ...
- javascript数组在指定位置添加和删除元素
在JavaScript中,Array对象提供了一个强大的splice()方法,利用这个方法可以达到在数组的指定位置添加和删除元素的目的. 指定位置删除元素 要在指定位置删除元素,可以使用splice( ...
- 顺序表添加与删除元素以及 php实现顺序表实例
对顺序表的操作,添加与删除元素. 增加元素 如下图所示 对顺序列表 Li [1328,693,2529,254] 添加一个元素 111 ,有三种方式: a)尾部端插入元素,时间复杂度O(1); ...
随机推荐
- kubernetes中infra容器的理解
1. infra容器和用户容器的关系 1.1 pause 是k8s的基础设施的一部分,pod中其他容器通过pause容器跟其他pod进行通信. 1.2 pod中其他容器跟pause容器共享命名空间1. ...
- [06] Bean属性的注入
之前我们提到了Bean实例化的三种方式:构造器方式.静态工厂方式.普通工厂方式.那么对于Bean中的属性,又是如何进行注入的(依赖注入),这个篇章就来提一提. 1.先提提什么是"依赖注入&q ...
- 一篇文章让你彻底掌握 shell 语言
一篇文章让你彻底掌握 shell 语言 由于 bash 是 Linux 标准默认的 shell 解释器,可以说 bash 是 shell 编程的基础. 本文主要介绍 bash 的语法,对于 linux ...
- CDH hive-1.1.0-cdh5.10.0 安装
又重新安装Hive,记录一下吧: hadoop早已经装上了. cdh5的hive下载地址: http://archive.cloudera.com/cdh5/cdh/5/ 下载文件:hive-1.1. ...
- Oracle_忘记密码
1.运行到C盘根目录 2.输入:SET ORACLE_SID = 你的SID名称 3.输入:sqlplus/nolog 4.输入:connect/as sysdba 5.输入:altre user s ...
- Session之Config配置
<sessionState mode="Off|InProc|StateServer|SQLServer" cookieless="true|false" ...
- Git常用命令梳理
在日常的Git版本库管理工作中用到了很多操作命令,以下做一梳理: 查看分支列表,带有*的分支表示是当前所在分支 [root@115~~]#git branch 查看分支详细情况 (推荐这种方式) [r ...
- B. Interesting drink
链接 [http://codeforces.com/group/1EzrFFyOc0/contest/706/problem/B] 题意 给你n个数,q次查询,每次输入一个m,问n个数中有多少个数小于 ...
- 软件工程启程篇章:结对编程和进阶四则运算(197 & 199)
0x01 :序言:无关的事 I wrote a sign called "Dead End" in front of myself, but love crossed it wit ...
- Sublime Text3前端必备插件
安装Package Control 在安装插件之前,需要让sublime安装Package Control.打开Sublime Text的控制台,快捷键ctrl + ~,在控制台中输入以下代码. im ...