<!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. 【TOP】top命令的load average的意义

    一. 怎么查看机器负载 uptime 命令: $uptime 14:32:32 up 108 days, 23:04, 17 users,  load average: 0.06, 0.08, 0.0 ...

  2. MySQL学习笔记(一)：SQL基础

    定义:SQL即Structure Query Language(机构化查询语言)的缩写,是使用关系数据库的应用语言. 包括三个类别: (1):DDL(Data Definition Language) ...

  3. Tencent分布式开源框架Pebble

    最近研究了T分布式开源框架Pebble,基本上想要的基础组件都有了,不过文档很糟糕,这也是T特色,只管开源不管维护:1.支持rpc/reverse_rpc2.支持http驱动3.支持tcp驱动(基于z ...

  4. vue指令v-on示例解析

    绑定事件监听器.事件类型由参数指定.表达式可以是一个方法的名字或一个内联语句,如果没有修饰符也可以省略. 1.事件 .click .mouseover .keyup ...... 2.修饰符 .sto ...

  5. asp.net 程序，当发生找不到文件的错误时，如何正确定位是哪个文件？

    需要在Global.asax.cs中添加Application_Error代码如下,在Log中查看是哪个文件缺失: protected void Application_Error(object se ...

  6. java 内存模型的理解

    之前一直在实习,博客停写了一段时间,现在秋招开始了,所以辞职回来专心看书,同时将每天的收获以博客的形式记录下来.最近在看jvm相关的书籍,下面对面试中问得最多的部分--java 内存模型. 本篇博客大 ...

  7. ecshop中的些assign_dynamic(’')

    很多做电子商务站的朋友都问我,在ecshop中,里面有个 assign_dynamic('index');这个到底是什么作用来的,这个其实是ecshop中的模板技术,动态处理一些局部信息更新而不被缓存 ...

  8. 什么是IAT重定向

    例壳:telock 0.98 仅允许非商业转载,转载请注明出处

  9. python基础===使用switch方法，减少使用if语句

    def jia(x,y): return x+y def jian(x,y): return x-y def cheng(x,y): return x*y def chu(x,y): return x ...

  10. Oracle 外键约束

    本文讨论一下Oracle中的外键约束问题,以及和DB2中的小不同. 首先创建测试环境. -- 创建测试主表. ID 是主键. CREATE TABLE test_main ( id INT, valu ...