`
繁花碎落
  • 浏览: 10305 次
  • 性别: Icon_minigender_2
  • 来自: 西安
最近访客 更多访客>>
文章分类
社区版块
存档分类

关于jquery clone的问题

阅读更多
请问我下面代码执行后为什么不能达到预期效果。我希望克隆列表中的所有连接并把他们包装到一个div标签里。大家帮忙分析下,谢谢!
jquery代码如下:
$(function()
{
var copy = $('.myList li a').clone();
copy.wrap($('#myDiv'));
});
html代码缩影:
<div id="someDiv">This is a &lt;div&gt; with an id of <tt>someDiv</tt></div>
<div id="myDiv" title="myTitle1"><span>Hello</span></div>
<div title="myTitle2"><span>Goodbye</span></div>

<ul class="myList">
  <li><a href="http://jquery.com">jQuery supports</a>
    <ul>
      <li><a href="css1">CSS1</a></li>
      <li><a href="css2">CSS2</a></li>
      <li><a href="css3">CSS3</a></li>
      <li>Basic XPath</li>
    </ul>
  </li>
  <li>jQuery also supports
    <ul>
      <li>Custom selectors</li>
      <li>Form selectors</li>
    </ul>
  </li>
</ul>


------------------------------------------------------------------------------------------------------------------
问题补充:

winner720 写道
copy.wrap($('#myDiv'));

改成:

copy.appendTo("#myDiv"); 或者 $("#myDiv").append(copy);


我实在尝试用wrap的方法实现这个功能 这样能帮助我更好的理解wrap的应用 是不是这里不能用wrap 如果是 请告诉我为什么
=====================================================================
wrap是包裹功能。(按照你的需求不该用wrap)

详细信息见jquery文档

返回值:jQuery wrap(elem)
概述
把所有匹配的元素用其他元素的结构化标记包装起来。


参数
elemElement用于包装目标元素的DOM元素

示例
描述:
用ID是"content"的div将每一个段落包裹起来

HTML 代码:
<p>Test Paragraph.</p><div id="content"></div>jQuery
代码:
$("p").wrap(document.getElementById('content'));
结果:
<div id="content"><p>Test Paragraph.</p></div><div id="content"></div>
分享到:
评论

相关推荐

    jquery.clone.js

    jquery.clone

    jQuery Clone Bug解决代码

    jQuery Clone Bug 解决代码 jQuery Clone Bug 是一个常见的 jQuery bug,导致在克隆 DOM 元素时,事件处理函数被无限递归调用。下面是解决该 bug 的代码和相关知识点。 事件绑定和 $.data() 方法 在 jQuery 中,...

    jquery-clone-tableheader table 头部固定

    为了解决这个问题,我们可以采用"jquery-clone-tableheader"方法,实现table头部抬头固定的效果。 "jquery-clone-tableheader" 是一个基于 jQuery 的插件,它的主要功能是复制表格的头部,在表格内容区域出现滚动条...

    jquery的clone方法应用于textarea和select的bug修复

    测试发现,textarea和select的jquery的clone方法有问题,textarea和select的值clone的时候会丢掉,发现这个是jquery的一个bug,上不了的可以看下代码,比较简单。就是在clone的时候将val再重新赋值一下,如果知道这个...

    JQuery中clone方法复制节点

    最后,希望本文所讲述的关于JQuery中clone方法复制节点的内容,能够为正在进行jQuery程序设计的朋友们提供一些帮助。掌握clone方法的正确使用方法,将有助于开发者在进行Web开发时更加高效和灵活地操作DOM元素。

    关于jquery

    3. **DOM操作**:jQuery提供了一系列方便的方法,如`append()`(向元素内部添加内容),`remove()`(删除元素),`clone()`(复制元素)等,使DOM操作变得轻松。 4. **事件处理**:jQuery简化了事件绑定,如`$(...

    巧妙使用JQuery Clone 添加多行数据,并更新到数据库的实现代码

    本文介绍了如何通过使用JQuery的Clone方法来巧妙添加多行数据,并将这些数据更新到数据库中。首先,我们看到的是一个前端页面的HTML代码,这个页面包含了动态添加数据行的功能。接下来,我们深入探讨JQuery的Clone...

    关于jquery克隆,给元素赋值详解

    值得注意的是,jQuery的`clone()`方法默认不复制事件绑定,如果需要复制事件,可以传递`true`作为参数: ```javascript var clonedElementWithEvents = $("#myElement").clone(true); ``` 接下来,我们谈谈如何为...

    jquery-2.1.1.js 、jquery-2.1.1.min.js 【jquery包 js】

    2. **DOM操作**:jQuery提供了丰富的DOM操作接口,如`append()`、`prepend()`用于在元素内部添加内容,`remove()`用于删除元素,`clone()`用于复制元素。 3. **事件处理**:jQuery简化了事件绑定和解绑,`$...

    jQuery中clone()方法用法实例

    jQuery中的clone()方法是一个非常实用的工具,它能够帮助开发者复制DOM元素及其绑定的事件处理器,以便在页面上实现动态内容的增加或替换。本文档详细介绍了clone()方法的用法,包括它的定义、功能以及如何运用它来...

    jquery手册(jquery.cuishifeng.cn网页版)2

    2. **DOM操作**: jQuery提供了简便的方法来操作DOM,如`$(selector).append()`用于在选定元素后面添加内容,`$(selector).remove()`删除匹配的元素,`$(selector).clone()`复制元素。 3. **事件处理**: 使用`.on()`...

    jquery-1.8.3

    7. **版本更新**:jQuery 1.8.3之后,jQuery持续进行版本迭代,引入更多新特性并修复已知问题,但1.8.3因其稳定性和兼容性,至今仍被许多项目所采用。 总的来说,jQuery 1.8.3以其易用性和强大的功能,为前端开发者...

    jquery中文版离线手册

    2. **DOM操作**:jQuery提供了便捷的方法来创建、插入、删除DOM元素,如`append()`在元素内部追加内容,`remove()`移除元素,`clone()`克隆元素。 3. **事件处理**:jQuery统一了跨浏览器的事件处理,`click...

    JQuery1.4.1

    - **事件处理**: 支持多种事件绑定,如 `click()`, `change()`, `hover()` 等,同时提供了 `live()` 方法实现事件冒泡到祖先元素,解决了动态添加元素时事件绑定的问题。 ### 3. 文件解析 - **jquery-1.4.1.js**: ...

    jQuery中clone()函数实现表单中增加和减少输入项

    在jQuery中,`clone()`函数是一个非常实用的功能,它用于复制匹配元素集合中的所有元素,包括它们的子元素。在处理动态表单时,比如需要增加或减少输入项,`clone()`函数尤其有用。本文将深入讲解如何使用`clone()`...

    jquery1.12.4与jquery1.12.4.min

    2. **DOM操作**:jQuery提供了丰富的API来创建、修改和操作DOM元素,如`append()`用于向元素内部添加内容,`remove()`用于移除元素,`clone()`用于复制元素等。 3. **事件处理**:jQuery简化了事件绑定,如`click...

    jQuery1.8_jQuery·框架_

    **jQuery1.8框架详解** jQuery,作为一款广泛使用的JavaScript库,极大地简化了网页的DOM操作、事件处理、动画设计和Ajax交互。jQuery1.8是该库的一个重要版本,它在保持易用性的同时,引入了一些改进和新特性,为...

    JQuery实现的类似购物商城的购物车

    JQuery Clone 模板来实现商品信息的展示,展现形式可以通过修改模板中的td来确定每一行显示多少个商品信息商品信息使用JSON数据来模拟 同一个产品点击多次,不会重复添加,而是在已有的基础上数量+1, 商品数量...

Global site tag (gtag.js) - Google Analytics