jQuery关于动态添加Dom-CSDN论坛

jQuery关于动态添加Dom

Web 开发 > JavaScript

收藏回复

[问题点数：20分，结帖人Cool_xiaocao]

⋅利用javascript 进行单词组合 ⋅ 关于apache域名配置的问题 ⋅关于apache域名配置的问题 更多帖子 关注私信空间博客 Cool_xiaocao 等级 本版专家分：635 结帖率 89.29%: 思路是这样的：
1、编写一个方法，带一个jQuery对象参数，注意是jQuery对象
2、方法里面是动态添加Dom元素
3、首先动态创建<span> （$("<span/>")）
4、将创建的span添加到Body上
5、在span里面动态创建img ($("<img src='xxx.gif' alt='xxx.gif'"))
6、通过while(这里是举例)循环判断span里面有没有img元素，如果有多个(注意是多个)，把其删掉，只保留一个img

1-5的代码我基本会了，关键是第6步，怎么判断span里的img元素,把多余的删掉，只保留一个

再问一个问题 js中 hasChildNodes()方法，在jQuery中是哪个，或者有没有相似的

麻烦大家了..

2011-03-04 18:40:50

点赞只看楼主引用举报楼主收起

展开阅读全文

⋅此用户还没有发表过任何帖子 关注私信空间博客 TopDreamer 等级 本版专家分：131: $("span").find("img:not(:first)").remove();

2011-03-04 18:52:13

点赞只看TA 引用举报 #1得分 15

⋅ConnectionRefusedError: [WinError 10061] 由于目标计算机积极拒绝，无法连接。 ⋅怎么让程序自动重新运行 ⋅这个正则，^$为什么在中间，表示什么含义 更多帖子 关注私信空间博客 hongmei85 等级 本版专家分：23356 勋章 银牌 2017年8月总版技术专家分月排行榜第二 红花 2017年10月 PHP大版内专家分月排行榜第一 2017年9月 PHP大版内专家分月排行榜第一 2017年8月 PHP大版内专家分月排行榜第一 黄花 2017年11月 PHP大版内专家分月排行榜第二 2017年9月其他数据库开发大版内专家分月排行榜第二 2011年5月 Web 开发大版内专家分月排行榜第二 2011年4月 Web 开发大版内专家分月排行榜第二 蓝花 2017年9月 Web 开发大版内专家分月排行榜第三 2017年8月其他数据库开发大版内专家分月排行榜第三 2017年8月 Web 开发大版内专家分月排行榜第三 2011年3月 Web 开发大版内专家分月排行榜第三 2011年2月 Web 开发大版内专家分月排行榜第三

<body>

		<span id="ss"><img src="img/111.jpg" width="300" height="200" border="0" alt=""/><img src="img/11.jpg" width="300" height="200" border="0" alt=""/><br/><img src="img/22.jpg" width="300" height="200" border="0" alt=""/><br/><img src="img/11.jpg" width="300" height="200" border="0" alt=""/><br/><img src="img/22.jpg" width="300" height="200" border="0" alt=""/></span>

		<input type="button" value="Click" onclick="del()"/>

		<script type="text/javascript">

		<!--

			function del(){

				var a = $("span > img");

				alert(a.length);

				for (var i=1;i<a.length ;i++)

				{

					a[i].removeNode(true);

				}

			}

		//-->

		</script>

	</body>

2011-03-04 18:58:15

点赞只看TA 引用举报 #2得分 0

这样也可以

$("span > img:not(:first)").remove();

2011-03-04 19:00:14

点赞只看TA 引用举报 #3得分 5

⋅利用javascript 进行单词组合 ⋅ 关于apache域名配置的问题 ⋅关于apache域名配置的问题 更多帖子 关注私信空间博客 Cool_xiaocao 等级 本版专家分：635: 引用 2 楼 hongmei85 的回复:
HTML code
<body>
<span id="ss"><img src="img/111.jpg" width="300" height="200" border="0" alt=""/><img src="img/11.jpg" width="300" height="200" border="0" alt=""/><br/><img src="img/22.jpg"……

朋友，你这样的话，是一个一个的删除
我想要的效果是：如果span里面的img多于一个就把那些多的一次性删除，不是一个一个删，只保留一个，你的方法可以改进一下不？

2011-03-04 19:12:49

点赞只看TA 引用举报 #4得分 0

⋅利用javascript 进行单词组合 ⋅ 关于apache域名配置的问题 ⋅关于apache域名配置的问题 更多帖子 关注私信空间博客 Cool_xiaocao 等级 本版专家分：635: 引用 3 楼 hongmei85 的回复:
这样也可以JScript code
$("span > img:not(:first)").remove();

这种方法我试过了，也是一个一个地去删除
有没有方法一次性地去删除
例如span里面有4个img
我想把多出的3个一次性删除，只保留一个

2011-03-04 19:15:02

点赞只看TA 引用举报 #5得分 0

⋅此用户还没有发表过任何帖子 关注私信空间博客 showenxxx 等级 本版专家分：2499: 不知道楼主为什么有这个需求，楼上几种方法都可行，视觉效果上好像没有什么区别

程序执行一般都是一个一个执行的，如果你一定要同时删除3个img，那只有多线程作了，考虑用setTimeout做。

$("div").children().length 可以用来判断childnodes

2011-03-04 19:45:40

点赞只看TA 引用举报 #6得分 0

收起

收藏回复

Cool_xiaocao

等级：

关注私信 TA的帖子

六、jQuery中动态创建dom元素: 1.创建dom元素 var txt=$(“1234”); 2.内部追加（1）追加到当前父级元素内容之后 // 父级元素.append(追加元素) $("#my").append(txt); //追加元素.appendTo(父级元素) txt.appendTo($(&...

jquery动态添加、删除dom元素: jquery动态添加、删除dom元素点击标签，在下方动态添加选中的元素及内容，再次点击标签，在下方动态删除选中的标签及元素点击标签，在下方动态添加选中的元素及内容，再次点击标签，在下方动态删除选中的标签及元素...

jquery 动态添加Dom元素自动绑定事件: $('body').on("click",".js-cbx-noch",function(){ var id= $(this).attr('data-id'); $('#'+id).click();...通过这种方式绑定，当异步加载通过jquery.append 动态添加的Dom元素，会自动绑定该事件 ...

JQuery动态生成的dom绑定事件: 需要实现一个功能，每一天文件列表下对应不同的文件，我要为这些动态生成的文件绑定相应的事件。记录一下解决相应过程。待处理的HTML: div class="col-sm-9" id="filelist"> video controls="" width="320...

解决JQuery动态添加DOM节点，原点击事件无效的方法。: 实例问题见下 <html> <div id="spanArray"> <span class="spanOne">我是原有标签，点击我控制台输出信息</span> </div> <script>... $(".spanOne").click(f...

jQuery给动态循环创建的dom添加事件: 在使用jQuery时，经常需要根据后端获取的数据循环创建dom，而且给创建的某个元素添加事件 $("div").on('click', function{ console.log("div"); }) 用上面这种方式是绑定不了事件的，所以需要通过下面这种方式来...

解决vue 中使用v-html或者jquery 动态添加dom元素，样式不生效: 新添加的dom，在实际意义上是一个子组件，vue中当我们给style设置了 scoped,该样式就只针对当前组件生效，样式不会渗透到子组件。解决办法： 1. 把样式写在公共全局css中。 2.使用深度选择器 >>> 或...

jquery查找动态添加的元素（！并不是绑定事件，而是查找dom元素）: 无论是jquery的.on，还是.live亦或者.bind，都可以为动态追加的元素添加各种事件，但是有一个问题，你事件是能添加上，但是我不想要添加事件，我想要的是查看这个追加的dom元素他的text内容，他的value值，那应该...

jQuery添加DOM节点常用的5种方法: 一、内部插入（前插入、后插入）： ...jQuery添加DOM节点常用的五种方法</title> <script type="text/javascript" src="js/jquery-1.8.3.js" ></script> </head> <body&g

Jquery each() 如何操作动态添加的DOM元素: 由于数据列表是动态由ajax加载的，所以当使用到jquery的each()进行循环操作时不能进行操作的问题，解决方案是讲ajax设置为同步 async: false,//使用同步的方式,true为异步方式 ...

javascript,jquery动态添加dom元素，并设定css属性，点击事件: $('>',{ alt:'hello img!', //设置alt属性 title:'just for test', //设置title属性 click:function(){ //绑定点击事件 alert("添加div元素!!!"); } }).css({

jQuery动态创建DOM之后，给新创建的DOM绑定事件。: 刚开始我的做法是，找到dom元素，直接绑定change事件，结果什么效果没有。上代码。。 $("#select-type").change(function () { console.log(1); if($("#select-type option:selected")....

jquery动态添加dom节点 js动态添加dom节点: 今天让jquery忽悠了一个小时有余，我想做个动态创建节点的功能，代码如下：var addDom = function(parent){var liNode = document.createElement("li"); liNode.innerHTML = "${a.objectName }${a.id }"; parent....

Jquery 动态添加dom后，再为其绑定事件: --> //四要素 var strPic="http://img04.taobaocdn.com/tfscom/i2/T15QseFKlbXXb1upjX_400x400.jpg,... var arrPic=strPic.sp

动态添加DOM元素后，新元素jQuery点击事件失效【问题解决】: bootstrap标签页内容窗格转换失效；动态添加DOM元素后，新元素jQuery点击事件失效

jquery给动态dom绑定事件: 如果需要给一个按钮绑定... 但是在给动态生成的dom绑定事件的时候，无法绑定了。查询了jquery API，如果需要给还不存在的节点绑定事件，可以通过on方法解决这个问题，即事件委托。在jQuery 中，通过事件冒泡的特性

JQuery给动态生成的DOM元素绑定点击事件: 原因是：ajax有个请求时间，无论是同步还是异步，JQuery进行的绑定都会在页面加载完后立刻进行，而不是等待ajax请求完。也就是说，绑定的元素绑空了。那这个问题怎么解决呢。方法如下：在动态生成的时候绑定一个...

jQuery Dom 操作，动态生成dom，绑定事件: 1、获取内容 - text()、html()以及val() text()-设置货返回所选的元素的文本内容；$("#text").text(); ... val() - 设置货返回表单字段的值 $("#text").val();...attr() - 获取属性值 $("#text").attr(" hr...

动态添加dom元素，并绑定VUE事件: VUE动态添加dom元素并绑定事件当我有这个需求的时候，去网上搜索了很久，都没找到通俗易懂的指导，后面还是解决了这个问题，在这里记录一下：需求：我需要根据数据在&amp;amp;amp;amp;amp;amp;amp;lt;...

关于jquery 的绑定事件on 如何绑定动态生成的dom元素: 今天遇到个问题，在table里面动态更新数据，然后每一行会绑定相应的点击事件 ...这段代码在页面加载时的表格中是起作用的，但是当ajax动态更新表格数据之后就不起作用了，原因是jq读到这段代码时，浏览器还没更

jQuery如何获取动态添加的元素: 　用jQuery的append()方法动态添加了一段html代码之后，发现在为新添加的元素绑定click事件时无法获取该新元素。二、解决方法　度娘推荐的方法基本是用live()方法　live()的官方定义和用法: ...

jquery为动态dom元素绑定点击事件(比如动态生成的表格): 需要给页面动态加载还未出现的元素添加事件时，可以用jQuery的on，live，delegate来绑定事件。叫做委派事件。比如控制的动态生成的表格，给一列中的元素添加事件就是如此。推荐用on，用法如下：on(event,child...

jquery实现动态添加html代码: 先看下思导图，整体了解下，然后我们再来学习。 ...现在我们来看一下几段代码，然后根据这几段代码我们来学习一下如何正确的学习动态添加html。一.html()方法 html函数的作用原理首先是移除目标元

JQuery(内部插入DOM节点): @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /&...gt

动态生成dom元素时，jquery点击事件失效: 这周在工作中遇到一些小问题，趁着不加班，来记录一下，好记性不如Mac键盘，啊哈哈先吟一句诗。问题页面上一些元素是通过js动态生成...$('#domId').on('click','.newClass',function(){ //doSomething; }) //此...

jQuery操作DOM节点: |-----html(); text(); val();获取值 html():文本和标签都可以解析出来 text():只能获取文本 val():获取input:text中的值！|----- html(content); text(content); val(content);设置 html：设置节点 text：...

使用jQuery操作DOM重点总结: DOM操作分为三类： DOM Core：任何一种支持DOM的编程语言都可以使用它，如getElementById() HTML-DOM：用于处理HTML文档，如document.forms CSS-DOM：用于操作CSS，如element.style.color="...jQuery对...

jquery动态添加元素和动态添加click事件: 动态创建btn并添加事件5.不好使的原因6.动态创建的元素添加click事件正确姿势 1.动态追加HTML元素 function appendText() { var txt1 = "<p>Text.</p>"; // Create element...

轻松学Linux系列课程: 从0开始，Linux云计算系列课程，包含Linux初级运维、运维、初级架构师、云计算运维及开发..... a:0:{}

jdk1.8 64位官方正式版 jdk-8u91-windows: jdk1.8 64位官方正式版 jdk-8u91-windows

相关热词 c#调用java程序疯狂c# c#多线程处理文本 c# 处理二进制数据类型 c# 如何写文件 c#如何判断程序已打开 c# 标题大小 c# socket 网卡 c#操作sql c#遍历tree