- 修改添加back top链接的代码,以便这些链接只从第四段后面才开始出现。
- 在单击back to top链接时,为每个链接后面添加一个新段落,其中包含You were here字样。确保链接仍然有效。
- 在单击作者名字时,把文本改为粗体(通过添加一个标签,而不是操作类或css属性)。
- 挑战:在随后单击粗体作者名字时,删除之前添加的元素(也就是在粗体文本与正常文本之间切换)。
挑战:为正文中的每一个段落添加一个inhabitants类,但不能调用.addClass()方法。确保不影响现有的类。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36//1
var $pAfterThree = $('div.chapter p').eq(2).nextAll();
$('<a href="#top">back to top</a>').insertAfter($pAfterThree);
$('<a id="top"></a>').prependTo('body');
//2
$('a[href $= "#top"]').on('click', function(){
$('<p>You were here</p>').insertAfter(this);
})
//4第一种方法(第三题包含在4的方法中)
var flag = 0;
$('#f-author').on('click', function() {
if (flag == '0') {
$(this).wrap("<b></b>");
flag = 1;
}else {
$(this).unwrap();
flag = 0;
}
});
//4第二种方法
//$('<a href="#top">back to top</a>').insertAfter('div.chapter p');
//$('a[href$="#top"]').on('click', function(){
// $('<p>You were here</p>').insertAfter(this);
//});
//5
$('p').each(function(){
var a = $(this).attr('class');
if(a == null){
$(this).attr('class','inhabitants');
}else{
$(this).attr('class',a + ' inhabitants');
};
});