快上网专注成都网站设计 成都网站制作 成都网站建设
成都网站建设公司服务热线:028-86922220

网站建设知识

十年网站开发经验 + 多家企业客户 + 靠谱的建站团队

量身定制 + 运营维护+专业推广+无忧售后,网站问题一站解决

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

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


当前名称:jquery添加div,jQuery添加标签
网址分享:http://6mz.cn/article/dsipeog.html

其他资讯