资讯

精准传达 • 有效沟通

从品牌网站建设到网络营销策划,从策略到执行的一站式服务

jquery清空div内容,jquery清空html内容

jquery怎么清空div的子元素

如需删除元素和内容,一般可使用以下两个 jQuery 方法:

我们提供的服务有:网站建设、成都网站建设、微信公众号开发、网站优化、网站认证、章丘ssl等。为上1000家企事业单位解决了网站和推广的问题。提供周到的售前咨询和贴心的售后服务,是有科学管理、有技术的章丘网站制作公司

remove() - 删除被选元素(及其子元素)

empty() - 从被选元素中删除子元素

本文实例讲述了jQuery使用empty()方法删除元素及其所有子元素的方法,分享给大家供大家参考,具体实现方法如下:

$.ajax({

url: "SearchSN.aspx",

data: "SN=" + $("#txtStorageSN").val(),

cache: false,

success: function (html) {

$("#showResult").empty();

$("#showResult").append(html);

$("#showResult").css("color", "red");

}

});

页面:div id="showResult"/div

$("#showResult").empty();//清除div内容(Div内容是通过aspx页面进行动态添加的,需要先清除div内容)

jquery 获取所有div,可以一键同时清空div内容

jquery能直接取出所有的div,它的text()方法可以用来清空div。那么可以这样写:$("div").text("");这样就清空的所有的div内容了

怎么在jquery里清空文本框的内容

可以使用 jQuery 设置内容的val()方法来实现,设置内容为空即达到清空文本框内容的目的:

$("input[name='test']").val("").focus(); // 将name=test的文本框清空并获得焦点,以便重新输入

示例代码如下

创建Html元素

div class="box"

span点击按钮后清除文本框内容:/spanbr

div class="content"

input type="text" name="test" value="这是默认的内容"

/div

input type="button" class="btn" value="清除文本框内容"

/div

设置css样式

div.box{width:300px;height:250px;padding:10px 20px;margin:20px;border:4px dashed #ccc;}

div.boxspan{color:#999;font-style:italic;}

div.content{width:250px;height:100px;margin:10px 0;padding:5px 20px;border:2px solid #ff6666;}

input[type='text']{width:200px;height:30px;border:none;}

input[type='button']{width:120px;height:30px;margin:10px;border:2px solid #ebbcbe;}

编写jquery代码

$(function(){

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

$("input[name='test']").val("").focus(); // 清空并获得焦点

});

})

观察效果

初始状态

点击按钮清空文本框后

JQuery,如何清除,除了点击的元素以外,其他所有元素

可以使用Jquery中的siblings()和remove()方法实现。实现原理主要是使用siblings获取被点击元素之外的同级元素,然后使用remove()删除。完整的代码如下:

运行的效果如下:

例如当点击DIV内容为2的框时,其他的DIV被清除,内容为2的框移到最顶,点击后的效果图如下:

扩展资料:

如果想对移到最顶的框进行一定的突出显示处理,比如给个背景颜色,字体加大,可以利用css()方法,代码如下:

!doctype html

html

head

meta charset="utf-8"

titleJQuery例子/title

link href="__CSS__/base.css" rel="stylesheet"

script src="__JS__/jquery.min.js"/script

/head

body

script

$(function(){

$(".class1").click(function() {

$(this).siblings().remove();

$(this).css({"background-color":"yellow","font-size":"50px"});

});

});

/script

div class="main"

div class="class1"1/div

div class="class1"2/div

div class="class1"3/div

div class="class1"4/div

/div

style type="text/css"

.main{width:640px;height:500px;margin:0 auto;border:1px solid red;}

.class1{width:90%;height:100px;margin:0 auto;border:1px solid red;margin-top:10px;font-size:40px;}

/style

/body

/html

运行的效果如下:

jquery删除div中动态添加的元素?

jquery 提供了remove() 方法,用来移除被选元素,包括所有文本和子节点。因此只需根据添加的div的id即可将其删除:

$(div_id).remove();

实例演示如下:

HTML结构

input type="button" value="删除"

div id="test"这是示例的DIV/div

jquery代码

$(function(){   $("input[type='button']").click(function() {        $("div#test").remove();   });


分享标题:jquery清空div内容,jquery清空html内容
网页地址:http://cdkjz.cn/article/dsipgeg.html
多年建站经验

多一份参考,总有益处

联系快上网,免费获得专属《策划方案》及报价

咨询相关问题或预约面谈,可以通过以下方式与我们联系

大客户专线   成都:13518219792   座机:028-86922220