jQuery 기초 강좌(3판) 연습 참고 답안(2~6장)
5790 단어 jQuery
$(document).ready(function() {
//(1)
//$('#selected-plays > li > ul > li').addClass('special');
$('#selected-plays li:not(#selected-plays > li)').addClass('special');
//(2)
$('td:nth-child(3)').addClass('year');
//(3)
$('td:contains(Tragedy):eq(0)').siblings().andSelf().addClass('special');
//(4)
$('li a').bind('click',function(){
$(this).parent().siblings().andSelf().addClass('afterlink');
});
//(5)
$('a[href$=".pdf"]').parent().parent().addClass('tragedy');
});
제 3 장
$(document).ready(function() {
//(1)
$('.author').bind('click',function(){
$(this).addClass('selected');
});
//(2)
$('.chapter-title').dblclick(function(){
$(this).parent().find('p').toggleClass('hidden');
});
//(3)
//
//(4)
$('.chapter p').mousemove(function(event){
// screenX: , screenY , 。
console.log('screen X: ' + event.screenX + ' screen Y: ' + event.screenY);
// clientX: screenX , 。
console.log('client X: ' + event.clientX + ' client Y: ' + event.clientY);
});
//(5)
var Lx;
var Ly;
$(document).mousedown(function(vdown){
Lx = vdown.clientX;
Ly = vdown.clientY;
});
$(document).mouseup(function(vup){
if(vup.clientX == Lx && vup.clientY == Ly){
$('p').addClass('hidden');
} else if(vup.clientY > Ly) {
$('p').removeClass('hidden');
}
});
});
제 4 장
$(document).ready(function(){
//(1)
$('body')
.hide()
.fadeIn('slow');
//(2)
$('p').mouseenter(function(){
$(this).css({backgroundColor: '#ff0'});
});
//(3)
$('h2').click(function(){
$(this)
.css({position: 'relative'})
.fadeTo('slow', 0.25)
.animate({
left : '20px'
},{
duration: 'slow',
queue: false
})
.queue(function(){
$('.speech').fadeTo('slow', 0.5);
});
});
//(4)
$(document).keyup(function(event){
$('#switcher').css({position: 'relative'})
switch(event.keyCode) {
case 37:
$('#switcher').animate({left: '-=20px'},'slow');
break;
case 38:
$('#switcher').animate({top: '-=20px'},'slow');
break;
case 39:
$('#switcher').animate({left: '+=20px'},'slow');
break;
case 40:
$('#switcher').animate({top: '+=20px'},'slow');
break;
}
});
});
제 5 장
$(document).ready(function(){
//(1)
var $paragraph = $('div.chapter p');
$paragraph.each(function(index){
if(index >= 3) {
$(this).after('back to top');
}
});
$('').prependTo('body');
//(2)
$('a[href$="top"]').click(function(){
$('#here').remove();
$(this).after('You were here
');
});
//(3)
$('#f-author').click(function(){
$(this).wrapInner('');
});
//(4) 4 , 3
$('#f-author').click(function(){
if($(this).html() == $(this).text()){
$(this).wrapInner('');
} else {
$(this).html($(this).text());
}
});
//(5)
$('p').attr('class',function(){
if($(this).attr('class') == undefined){
return 'inhabitants';
} else {
return $(this).attr('class') + ' inhabitants';
}
});
});
제6장
$(document).ready(function(){
//(1)
$('#dictionary').load('exercises-content.html .letter');
//(2) 2 , 1
$('#letter-a a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-a');
},function(){
$('#dictionary').empty();
});
$('#letter-b a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-b');
},function(){
$('#dictionary').empty();
});
$('#letter-c a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-c');
},function(){
$('#dictionary').empty();
});
$('#letter-d a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-d');
},function(){
$('#dictionary').empty();
});
$('#letter-e h3').hover(function(){
$('#dictionary').load('exercises-content.html #letter-e');
},function(){
$('#dictionary').empty();
});
$('#letter-f h3').hover(function(){
$('#dictionary').load('exercises-content.html #letter-f');
},function(){
$('#dictionary').empty();
});
$('#letter-g a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-g');
},function(){
$('#dictionary').empty();
});
$('#letter-h a').hover(function(){
$('#dictionary').load('exercises-content.html #letter-h');
},function(){
$('#dictionary').empty();
});
//(3),(4) No server.Practice will be completed next time.
});
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
Ajax 이용시 로컬 파일이 CORS 에러가 되었을 때의 대응초보의 초보로 입문편의 참고서를 보면서 공부하고 있어, Ajax에서 로컬 파일을 호출하려고했지만 CORS 정책 오류로 인해 실패했습니다. 브라우저에서 로컬 파일(html)을 표시한 것뿐. 사용 브라우저는 chrome...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.