使用JS增加标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type="button" onclick="AddEle1();" value="+++">
<input type="button" onclick="AddEle2();" value="+++2">
<div id="i1">
<input type="text"/>
<hr/>
</div>
<script>
function AddEle1() {
// 创建一个标签,将标签添加到指定标签里面
var tag="<p><input type='text'/></p> ";
document.getElementById('i1').insertAdjacentHTML("beforeEnd",tag);
// 四个参数beforeBegin、 afterBegin、beforeEnd、afterEnd
}
function AddEle2() {
// 创建一个标签,将标签添加到指定标签里面
var tag=document.createElement('input');
tag.setAttribute('type','text');
tag.style.fontSize='19px';
tag.style.color='red'; var p =document.createElement('p');
p.appendChild(tag)
document.getElementById('i1').appendChild(p)
}
</script>
</body>
</html>
使用JS增加标签的更多相关文章
- JS添加标签效果
JS添加标签效果 在豆瓣网上添加自己的标签是一种常见的效果,今天也就做了一个简单的demo.由于时间的问题 我不多原理,大家可以试着操作几遍就能明白其中的原理了. JSFiddle的效果如下: 点击我 ...
- JS修改标签中的文本且不影响其中标签
/********************************************************************* * JS修改标签中的文本且不影响其中标签 * 说明: * ...
- js 中标签的增删 方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- js增加收藏
<html> <span style="white-space:pre"> </span><head> <span style ...
- js 父子标签同时设置onclick,子标签触发父标签onclick解决办法
js 父子标签同时设置onclick,子标签触发父标签onclick 或 子标签为a 先触发onclick 再触发 a 的 href: 解决方案:在子标签的onclick里写 var ev = win ...
- JS获取标签内容的方法
JS获取标签内容的方法 测试代码 <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- html页面中插入html的标签,JS控制标签属性
html页面中插入html的标签 方法1: 使用标签: <textara> </textara>标签 方法2: 使用JS: document.getElementById(&q ...
- 1kb 的 placeholder.js 增加 img 标签使用方式
预览 官方网站示例. 项目 github 地址 使用 引入 placeholder.js 到你的前段代码中: <script src="placeholder.js"> ...
- 原生js文字标签云上下滚动播放
效果:http://hovertree.com/texiao/js/25/ 效果图: 代码如下: <!DOCTYPE html> <html> <head>< ...
随机推荐
- 命令——tree
tree——以树形结构显示目录文件 [root@centos71 ~]# yum provides tree Loaded plugins: fastestmirror Loading mirror ...
- delphi exec error 错误处理
有时引用了三方jar后报错 [Exec Error] The command "PATH ..."" exited with code 1 解决方法 1.检测jar文件路 ...
- UML规则笔记
一.类 类(Class)封装了数据和行为,是面向对象的重要组成部分,它是具有相同属性.操作.关系的对象集合的总称. 在系统中,每个类都具有一定的职责,职责指的是类要完成什么样的功能,要承担什么样的义务 ...
- 【PowerOJ1744&网络流24题】方格取数问题(最小割)
题意: n,m<=30 思路: [问题分析] 二分图点权最大独立集,转化为最小割模型,从而用最大流解决. [建模方法] 首先把棋盘黑白染色,使相邻格子颜色不同,所有黑色格子看做二分图X集合中顶点 ...
- Internet History, Technology, and Security(week7)——Technology: Application Protocols
Layer 4: Applications Application Layer TCP提供了“a reliable pipe”(一个坚固的水管)连接用户和服务器,确保了数据能准确不出意外地传输,所以A ...
- android 任务栈及启动模式
1.一个应用程序一般都是由多个activity组成的.2.任务栈(task stack)(别名back stack后退栈) 记录存放用户开启的activity的.3.一个应用程序一被开启系统就给他分配 ...
- Android 获取屏幕尺寸与密度(转载)
android中获取屏幕的长于宽,参考了网上有很多代码,但结果与实际不符,如我的手机是i9000,屏幕大小是480*800px,得到的结果却为320*533 结果很不靠谱,于是自己写了几行代码,亲测一 ...
- [design pattern](2) Observer
前言 在上一个博客中我们介绍了Strategy模式,它是行为型模式麾下的一员大将.那么本博客我们来学习一下行为型模式麾下的另一员大将Observer模式. 思考题 老套路,先来思考下面的问题: 问题: ...
- Alexa TOP 100万的域名列表
Alexa是一家专门发布网站世界排名的网站,是亚马逊公司的一家子公司.Alexa每天在网上搜集多达几十亿的网址链接,而且为其中的每一个网站进行了排名. Alexa通过Alexa官网查询好像TOP 50 ...
- 大数据笔记(二十)——NoSQL数据库之MemCached
一.为什么要把数据存入内存? 1.原因:快2.常见的内存数据库 (*)MemCached:看成Redis的前身,严格来说Memcached的不能叫数据库,原因:不支持持久化 (*)Redis:内存数据 ...