jquery添加div,jQuery添加标签

用jq添加或移除div

问题分析：

站在用户的角度思考问题，与客户深入沟通，找到湖滨网站设计与湖滨网站推广的解决方案，凭借多年的经验，让设计与互联网技术结合，创造个性化、用户体验好的作品，建站类型包括：网站设计制作、成都网站设计、企业官网、英文网站、手机端网站、网站推广、主机域名、雅安服务器托管、企业邮箱。业务覆盖湖滨地区。

1、删除：使用jQuery的remove方法。

2、添加：使用jQuery的append、after等多个方法，这些不同的方法是用来决定标签添加的相对位置。

举例如下：

以内部追加方法append为例。

添加DIV：

$('body').append('div id="name"我是被添加的DIV标签/div');

删除刚刚添加的DIV：

$('#name').remove();

怎样用jquery为div添加一个div

使用attr()或prop()方法为id属性赋值即可，关键代码

$(obj_div).attr('id',id_name);

$(obj_div).prop('id',id_name);

实例演示如下：点击按钮设置div标签的id为test，为了便于观察效果，css中设置了id为test的样式为红色

1、HTML结构

style

#test{color:red !important; font-weight:bold;}

/style

div我是示例DIV/div

input type="button" value="设置上一个div的id为test"

2、jquery代码

$(function(){

$("input:button").click(function() {

$(this).prev("div").attr("id","test");

});

});

jquery 向DIV动态添加元素

1、通过jquery给元素动态添加样式运用addClass和removeClass即可。首先在html中准备jquery库文件，并且准备一个div元素，如下图所示。

2、然后在style标签里声明一个class样式，如下图所示。

3、接下来准备一个事件加载初始化的方法，在jquery中直接用匿名函数即可，如下图所示。

4、然后通过jquery的addClass方法给div元素添加一个class，如下图所示。

5、移除一个class的样式也很简单，如下图所示，通过removeClass即可。

怎么用JQuery动态添加div 比如 添加 点击一次添加按钮 增加一个div

!doctype html

html

head

meta charset="utf-8"

title插入输入框/title

script type="text/javascript" src="js/jquery-3.1.1.min.js"/script

script

function f1(){

var text='div class="a1"/divinput type="text"br';

if($("#a1").val()!="")

{

$("#baojie li").append(text);

};

};

/*function f1(btn){

var x = document.createElement("li");

var z=document.getElementById("baojie");

var input=document.getElementById("a1");

   var name = input.value;

if(name != ""){

z.appendChild(x).innerHTML='div class="a1"'+'/div'+'input type="text"'+'br';

}else{

return;

}

  }*/

/script

style type="text/css"

.neirong li{

 list-style-type:none;

 display:inline;

}

.neirong{

width:400px;

margin:0 auto;

}

.neirong div{

text-align:center;

width:50px;

display:inline-block;

margin:10px 0;

}

.neirong #btn{

background:none;

border:none;

color:#3d8ad4;

}

.neirong .a1{

height:16px;

width:58px;

}

/style

/head

body

!--logo--

div class="neirong"

form

uldiv时间/div

li

input type="text"

/li

/ul

ul id="baojie"div保洁员/div

li

input type="text"  id="a1"/input type="button" value="+添加一行" id="btn"  onClick="f1(this)" /br/

/li

/ul

uldiv费用/div

li

input type="text"

/li

/ul

/form

/div

/body

/html

这是我写的一个点击按钮添加输入框的代码，你可以参考一下（注意，我这是必须在输入框里输入内容后才能添加）