通过js给某个标签添加内容或者删除标签
添加内容
//先保存div中原来的html
var tag = document.getElementById("tag").innerHTML;
//构造新的内容
var couhtml = '<select id="options" name="options" class="form-control input-ssm"><option value = "0" > 请选择</option></select><button type="button" style="margin-left: 4px;" class="btn btn-primary btn-sm" id="cde2" onclick="addOption()">删除</button>';
//追加内容
document.getElementById("tag").innerHTML = tag + couhtml;
删除标签
//某个标签
var tag = document.getElementById("tag");
//删除
tag.parentNode.removeChild(tag);
完整的html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
</head>
<body>
<div id="tag">我是div中的文字,后面的内容是js追加的,不关我的事</div>
<script>
//先保存div中原来的html
var tag = document.getElementById("tag").innerHTML;
//构造新的内容
var couhtml = '<select id="options" name="options" class="form-control input-ssm"><option value = "0" > 请选择</option></select><button type="button" style="margin-left: 4px;" class="btn btn-primary btn-sm" id="cde2" onclick="addOption()">删除</button>';
//追加内容
document.getElementById("tag").innerHTML = tag + couhtml;
/*//某个标签
var tag = document.getElementById("tag");
//删除
tag.parentNode.removeChild(tag);*/
</script>
</body>
</html>
通过js给某个标签添加内容或者删除标签的更多相关文章
- /.nav-tabs :是普通标签页 .nav-pills:胶囊式标签页 action ;默认的激活项,给<li>加默认显示的是哪个标签页内容 .nav是标签页的一个基类,给ul加 .nav-stacked: 垂直排列BootStrap
<meta name="viewport" content="with=device-width, initial-scale=1, user-scalabe=no ...
- 【节点-添加标签】【节点-删除标签】【显示年-月-日-星期】【math算数】【正则表达式】
1.节点-添加标签 <body><div id="div1"><p id="p1">这是一个段落.</p>< ...
- Node.js 向一个文件添加内容
最简方案: fs.appendFile('message.txt', 'data to append', function (err) { }); 参考文档: http://www.codeweblo ...
- vue.js实现点击后动态添加class及删除同级class
最近使用vue需要实现一个点餐选择商品规格的页面,需要通过vue动态的给被点击的元素添加class名字,使其变色,其他的删除class.如图: 开始在网上找了许多办法发现不是太好用,最后找到一个发现还 ...
- Python之pptx实现添加内容与删除(移动)页操作
问题背景 大量表格数据需要生成指定格式的ppt文件,内容以文字和表格为主,首尾页与内容有固定格式.博主不熟悉VBA操作,希望通过模板用Python完成自动化. 基本思路 使用xlrd模块读取xlsx文 ...
- js html标签select 中option 删除除了第一行外的其他行
背景:共两个下拉框,第一个下拉框选择完之后,以第一个选定的值为条件返回第二个下拉框中的内容,用js中的createElement()创建,并利用appendChild()来添加进父标签.出现意外:每次 ...
- angularjs中向html页面添加内容节点元素代码段的两种方法
第一种方式:原生JS向html页面添加内容节点元素代码段: <!DOCTYPE html> <html> <head> <meta charset=" ...
- 原创:js代码, 让dedecms支持Tag选择, 添加内容更为方便,不用手输Tag
dedecms在编辑修改内容时,TAG标签需要手动输,中文的Tag, 中间还得用半角字符','分隔, 输入法切来切去很不方便, 于是动手改后台代码, 利用后台的tags_main.php, 让d ...
- js清除节点内容(改变标签元素)
<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" c ...
随机推荐
- 卷积涨点论文 | Asymmetric Convolution ACNet | ICCV | 2019
文章原创来自作者的微信公众号:[机器学习炼丹术].交流群氛围超好,我希望可以建议一个:当一个人遇到问题的时候,有这样一个平台可以快速讨论并解答,目前已经1群已经满员啦,2群欢迎你的到来哦.加入群唯一的 ...
- 手把手教你使用Python轻松搞定发邮件
前言 现在生活节奏加快,人们之间交流方式也有了天差地别,为了更加便捷的交流沟通,电子邮件产生了,众所周知,电子邮件其实就是客户端和服务器端发送接受数据一样,他有一个发信和一个收信的功能,电子邮件的通信 ...
- Selenium Web元素操作
我们定位到Web页面元素之后,可以对元素进行一系列的操作,实现跟页面的交互.包括点击.文本输入.元素属性获取等.常用的方法列举如下: 方法 描述 click() 点击元素 send_keys(**va ...
- 远程调用get和post请求 将返回结果转换成实体类
package org.springblade.desk.utils; import org.apache.http.client.ResponseHandler; import org.apache ...
- ProceedingJoinPoint 某些方法记录一下
转载与百度知道,记录一下.遇到在去看API 官方文档//拦截的实体类 Object target = point.getTarget(); //拦截的方法名称 String methodName = ...
- 批量修改vsphere共享存储多路径选择策略
传统方式修改存储的多路径选择策略 首先说一下传统web界面操作方式: 可以看到至少需要6次才能修改完成一个.在生产环境中一般会挂载很多FC存储,这时候就需要一个批量快捷的方式来修改. 使用Powerc ...
- 【vue】常用指令
vue指令带有前缀 v-. 一.v-bind 单向数据绑定 在html中显示数据,除了使用插值表达式{{}}之外,也可以使用vue中的v-bind指令. ... ... <body> &l ...
- android基本组件 Button
android中提供了普通按钮Buttton和图片按钮ImageButton两种按钮组件,ImageButton按钮中主要有一个android:src属性,用于设置按钮的背景图片.可以在Button的 ...
- ElasticSearch教程——自定义分词器(转学习使用)
一.分词器 Elasticsearch中,内置了很多分词器(analyzers),例如standard(标准分词器).english(英文分词)和chinese(中文分词),默认是standard. ...
- java的多线程:线程安全问题
什么是线程安全? 为什么有线程安全问题? 当多个线程同时共享,同一个全局变量或静态变量,做写的操作时,可能会发生数据冲突问题,也就是线程安全问题.但是做读操作是不会发生数据冲突问题. 抢火车的例子: ...