`

jquery:append 和 appendTo 在firefox和ie中的区别

阅读更多
在jquery 1.2 API中解释如下:
引用
appendTo(content)
所有匹配的元素追加到另一个、指定的元素元素集合中。
实际上,使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。

引用
append(content)
向每个匹配的元素内部追加内容。
这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似。


看似两个可以等同的操作,实际上在firefox和ie中是有差别的。
append(content)
html:
<p>I would like to say: </p>
juery:
$("p").append("<b>Hello</b>");
结果:
[ <p>I would like to say: <b>Hello</b></p> ] 

appendTo(content)
html:
<p>I would like to say: </p><div id="foo"></div>
juery:
$("p").appendTo("#foo"); 
结果:
<div id="foo"><p>I would like to say: </p></div>


换句话说 :
$("p").append("任意字符串");

$("任意字符串").appendTo("p");
这两个操作是否等同呢?

结论是在ie下是等同的,而在firefox下,$("任意字符串").appendTo("p")这句是会报错的。
原因可能是在firefox下$("任意字符串")不能作为匹配对象,如其文档中说明的那样appendTo(content)
所有匹配的元素追加到另一个、指定的元素元素集合中。

欢迎指正!


分享到:
评论
2 楼 rikugun 2009-05-31  
wangsong76 写道
在jquery 1.2 API中解释如下:
引用
appendTo(content)
所有匹配的元素追加到另一个、指定的元素元素集合中。
实际上,使用这个方法是颠倒了常规的$(A).append(B)的操作,即不是把B追加到A中,而是把A追加到B中。

引用
append(content)
向每个匹配的元素内部追加内容。
这个操作与对指定的元素执行appendChild方法,将它们添加到文档中的情况类似。


看似两个可以等同的操作,实际上在firefox和ie中是有差别的。
append(content)
html:
<p>I would like to say: </p>
juery:
$("p").append("<b>Hello</b>");
结果:
[ <p>I would like to say: <b>Hello</b></p> ] 

appendTo(content)
html:
<p>I would like to say: </p><div id="foo"></div>
juery:
$("p").appendTo("#foo"); 
结果:
<div id="foo"><p>I would like to say: </p></div>


换句话说 :
$("p").append("任意字符串");

$("任意字符串").appendTo("p");
这两个操作是否等同呢?

结论是在ie下是等同的,而在firefox下,$("任意字符串").appendTo("p")这句是会报错的。
原因可能是在firefox下$("任意字符串")不能作为匹配对象,如其文档中说明的那样appendTo(content)
所有匹配的元素追加到另一个、指定的元素元素集合中。

欢迎指正!





我很奇怪,你的 $("任意字符串") 是什么意思
据我所知,什么都不是吧, 这个appendTo() 是指

引用
Append all of the matched elements to another, specified, set of elements.


将符合selector的elements附加到另一个elements里头去

所以我不认为在IE下这个能有是件好事情.明显违背了API的意思

1 楼 opensuse 2009-05-31  
我感觉不是IE和FF的区别。

我也做了一些DEMO。有兴趣的话去看一下吧。

http://www.xiaoxiaozi.com/2009/05/31/694/

相关推荐

    jQuery-1.4.3.js和jQuery-API

    - **浏览器兼容性**:1.4.3版本支持大多数主流浏览器,包括IE6+,Firefox,Chrome,Safari,Opera等。 - **插件系统**:jQuery生态系统中有大量的插件,1.4.3版本可以配合这些插件使用,扩展其功能。 3. **jQuery...

    jquery-3.2.1 API参考手册.chm

    10. **兼容性(Compatibility)**:jQuery 3.2.1版本对多种浏览器有良好的支持,包括Internet Explorer 6+、Firefox、Chrome、Safari和Opera等。 通过这份API参考手册,开发者可以深入理解jQuery的每个功能,熟练...

    jquery-1.1.3 效率提高800%

    选择器速度提升 选择器的速度大幅度提高了,下表为jQuery1.1.2和1.1.3的选择器速度对比,提高了8倍多 Browser jQuery 1.1.2 jQuery 1.1.3 % Improvement IE 6 4890ms 661ms 740% Firefox 2 5629ms 567...

    jQuery 1.5 API 中文版

    IE用户无法在线查看本文档,请下载jQuery API Version1.5 中文版AIR客户端查看,或者使用chrome,safari,firefox,opera等浏览器查看!!! jQuery 1.5 API Cheat Sheet来源 Selectors Basics #id element .class, ...

    前端面试题(包含答案)

    9. `$(this)` 和 `this` 关键字在 jQuery 中有什么不同? * `$(this)` 返回一个 jQuery 对象,可以对它调用多个 jQuery 方法 * `this` 代表当前元素 10. `$(document).ready()` 方法和 `window.onload` 有什么...

    4.Jquery.docx

    - **跨浏览器兼容性**:jQuery 支持所有主流浏览器,包括但不限于 Chrome、Firefox、Safari、IE 和 Edge 等。 - **易用性**:jQuery 的 API 设计非常人性化,使得开发人员能够更快速地完成复杂的前端功能。 - **扩展...

    jQuery培训讲义

    `append(content)`在元素内部追加内容,`appendTo(content)`将元素追加到其他元素,`before(content)`和`after(content)`在元素之前或之后插入内容。 #### 3.8 CSS样式 `css(properties)`批量设置样式,`css(name, ...

    关于jQuery中的end()使用方法

    end()方法是jQuery的核心方法之一,它主要用于在链式操作中撤销最近的筛选操作,恢复到之前的状态。理解end()的工作原理对掌握jQuery的链式调用至关重要。 在jQuery中进行元素操作时,经常需要使用链式调用的方式来...

    使用jquery实现以post打开新窗口

    需要注意的是,这个函数可以确保在Firefox和其他浏览器中的兼容性,因为它利用了jQuery的DOM操作和事件处理功能,避免了纯JavaScript中可能存在的兼容性问题。 在实际应用中,可以调用`jQueryOpenPostWindow`函数来...

Global site tag (gtag.js) - Google Analytics