码迷,mamicode.com
首页 > Web开发 > 详细

Jquery学习

时间:2017-09-02 18:09:51      阅读:174      评论:0      收藏:0      [点我收藏+]

标签:log   apt   code   document   迭代   logs   包装   ndt   otn   

1.追加

.insertBefore()在现有元素外部、之前添加内容;
? .prependTo()在现有元素内部、之前添加内容;
? .appendTo()在现有元素内部、之后添加内容;
? .insertAfter()在现有元素外部、之后添加内容。

$(document).ready(function() {
  $(‘<a href="#top">back to top</a>‘).insertAfter(‘div.chapter p‘);
  $(‘<a id="top"></a>‘).prependTo(‘body‘);
});

 2.包裹

.wrapAll()把所有脚注都包含;

.wrap()将每一个脚注分别包装。

$(document).ready(function() {
    $(‘span.footnote‘)
    .insertBefore(‘#footer‘)
    .wrapAll(‘<ol id="notes"></ol>‘)
    .wrap(‘<li></li>‘);
});

3.迭代

.each():这个方法接受一个回调函数,这个函数会针对匹配的元素集中的每个元素都调用一次 。

$(document).ready(function() {
    var $notes = $(‘<ol id="notes"></ol>‘).insertBefore(‘#footer‘);
    $(‘span.footnote‘).each(function(index) {
        $(‘<sup>‘ + (index + 1) + ‘</sup>‘).insertBefore(this);
        $(this).appendTo($notes).wrap(‘<li></li>‘);
    });
});

 4.反向

.before和insertBefore;

.append和appendTo;

 $(‘<p>Hello</p>‘).appendTo(‘#container‘);
$(‘#container‘).append(‘<p>Hello</p>‘);

 

Jquery学习

标签:log   apt   code   document   迭代   logs   包装   ndt   otn   

原文地址:http://www.cnblogs.com/DaphneOdera/p/7467126.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!