<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

</head>

<body>

    <div id="i1">

        <input type="button" value="+" onclick="add_1();" style="background-color: red">

        <input type="button" value="+" onclick="add_2()" style="background-color: yellow">

    </div>

    <script>

        function add_1(){

            var tag = "<p><input type='text' style='background-color:red' /></p>" ;

            document.getElementById('i1').insertAdjacentHTML('beforeEnd',tag);

        }

        function add_2(){

            var tag = document.createElement('input');

            tag.setAttribute('type','text')

            tag.style.backgroundColor ='yellow';

            var p1 = document.createElement('p');

            p1.appendChild(tag)

            document.getElementById('i1').appendChild(p1)

        }

    </script>

</body>

</html>

Dom-创建标签的更多相关文章

  1. Dom之标签增删操作

    dom操作:THML新增子标签 a标签(appendChild) <!DOCTYPE html><html lang="en"><head> & ...

  2. JavaEE XML DOM创建

    DOM创建XML @author ixenos 1.思路: 先封装构建一颗DOM树,然后将DOM树转换成XML文件 2.三种写DOM树到XML文件的方式: 1)使用DOM(或DOM4J.JDOM) 2 ...

  3. Dom,查找标签和操作标签

    Dom,查找标签和操作标签 文档对象模型(Document Object Model,DOM)是一种用于HTML和XML文档的编程接口.它给文档提供了一种结构化的表示方法,可以改变文档的内容和呈现方式 ...

  4. Dom--属性以及创建标签

    一.Dom属性 1.1 设置属性(setAttribute) 设置某个标签的属性,setAttribute(key,value) <body> <div> <input ...

  5. 使用HTML、jquery、DOM创建文本

    <html> <head> <meta charset="utf-8"> <meta charset="utf-8"& ...

  6. DOM操作标签、事件绑定、jQuery框架/类库

    DOM操作标签 ''' 在起变量名的时候 如果该变量指向的是一个标签 那么建议使用 xxxEle eg:aEle\pEle\divEle\spanEle ''' # 动态创建一个a标签并添加到页面指定 ...

  7. DOM操作标签，事件绑定，jQuery框架

    DOM操作标签 ''' 在起变量名的时候 如果该变量指向的是一个标签 那么建议使用 xxxEle eg:aEle\pEle\divEle\spanEle ''' 基本使用 动态创建一个标签 var 变 ...

  8. js创建标签的方法--依赖于jquery

    /** * 创建标签,传入一个对象,返回一个完整的标签 * @param {Object.attribute} tag 标签 * @param {Object.attribute} attribute ...

  9. 使用script创建标签添加属性值和添加样式

    <mark>使用script创建标签和给标签属性值以及样式的方法</mark><script> window.onload=function(){ var btn= ...

  10. [原创]Devexpress XtraReports 系列 10 创建标签报表

    今天这篇是Dx Reports 基础初级系列的最后一篇了.以后如果有什么高级的应用,应该另开一个中级使用系列. 昨天发表了Devexpress XtraReports系列第九篇[原创]Devexpre ...

随机推荐

  1. Java 9 揭秘（20. JDK 9中API层次的改变）

    Tips 做一个终身学习的人. 在最后一章内容中,主要介绍以下内容: 下划线作为新关键字 改进使用try-with-resources块的语法 如何在匿名类中使用<>操作符 如何在接口中使 ...

  2. java对excel表格的上传和下载处理

    Excel表格文件的上传和下载,java中涉及到文件肯定会有io流的知识. 而excel文件就要涉及到poi技术,而excel的版本包括:2003-2007和2010两个版本, 即excel的后缀名为 ...

  3. 双向循环链表（C语言描述）（二）

    链表的基本操作基于对链表的遍历:计算链表的长度就是对链表进行一次遍历: int linkedlist_length(const LinkedList list) { assert(list); ; L ...

  4. Git时光机穿梭之撤销修改

    自然,你是不会犯错的.你在readme.txt中添加了一行: $ cat readme.txt Git is a distributed version control system. Git is ...

  5. python实战第一天-socket模块练习

    操作系统 Ubuntu 15.10 IDE & editor JetBrains PyCharm 5.0.2 ipython3 Python版本 python-3.4.3 导入socket模块 ...

  6. 利用GeoIP数据库及API进行地理定位查询 Java

    地理定位查询的的数据库比较多,而且大多都开放一些free的版本 国内的有纯真数据库等,但是他只提供文本的地理位置信息,不提供经纬度数据 当应用到google map时,就不可以了 国外的有MaxMin ...

  7. 6.linux下部署 web 项目

    安装java 1.下载 linux 环境的jdk 2.上传该压缩包到 linux 系统中并且解压 tar -zxvf 压缩包名 3.配置环境变量并且刷新配置 export JAVA_HOME=/ali ...

  8. java实现网页爬虫

    接着上面一篇对爬虫需要的java知识,这一篇目的就是在于网页爬虫的实现,对数据的获取,以便分析. -----> 目录:   1.爬虫原理 2.本地文件数据提取及分析 3.单网页数据的读取 4.运 ...

  9. 【机器学习笔记之二】决策树的python实现

    本文结构: 是什么? 有什么算法? 数学原理? 编码实现算法? 1. 是什么? 简单地理解,就是根据一些 feature 进行分类,每个节点提一个问题,通过判断,将数据分为几类,再继续提问.这些问题是 ...

  10. 不安分的this

    不安分的this 前言:关于javascript中的this,上网一搜一大片的文章.惊! 而我个人认为要想分清this,就有必要先搞清楚“对象”. 目录: 一.函数对象的认识 二.this 一.函数对 ...