SlideShare a Scribd company logo
要素を移動する書き方
next, prev, children, parent
セレクタの
<セレクタの書き方>
<div id=“content”>
<div id=“box0”></div>
<div id=“box”>
<p></p>
</div>
<div id=“box1”></div>
</div>
<script>
$(‘#box’).next() =次の要素 “box1”
$(‘#box’).prev() =前の要素 “box0”
$(‘#box’).children() =こどもの要素 p
$(‘#box’).parent() =親の要素 “content”
</script>
<セレクタの書き方>
メソッドとメソッドは、;で区切ります
$(function(){
$('#start').css('color', 'red');
$('#start').fadeOut('slow');
});
$(function(){
$('#start').css('color', 'red’).fadeOut('slow');
});
メソッドチェーン
メソッドは続けて書くことができます
セレクタが同じものは.(ドット)でつなげる
<メソッドの書き方>
css()メソッドで複数のプロパティを指定する方法
$(function(){
$('#start').css('color', 'red');
$('#start').css(’font-weight', ’bold');
});
$(function(){
$('#start').css({
'color’: 'red’,
'font-weight’:’bold’
});
});
<メソッドの書き方>

More Related Content

More from sayoko miura

miuratta-standard.pdf
miuratta-standard.pdfmiuratta-standard.pdf
miuratta-standard.pdf
sayoko miura
 
group-html
group-htmlgroup-html
group-html
sayoko miura
 
html
htmlhtml
Table
TableTable
Child.key
Child.keyChild.key
Child.key
sayoko miura
 
Clearfix.key
Clearfix.keyClearfix.key
Clearfix.key
sayoko miura
 
Form
FormForm
Css selector
Css selectorCss selector
Css selector
sayoko miura
 
Prevnext
PrevnextPrevnext
Prevnext
sayoko miura
 
This
ThisThis
Event.key
Event.keyEvent.key
Event.key
sayoko miura
 
Readyevent
ReadyeventReadyevent
Readyevent
sayoko miura
 
J query ready2.key
J query ready2.keyJ query ready2.key
J query ready2.key
sayoko miura
 
WhatsjQuery
WhatsjQueryWhatsjQuery
WhatsjQuery
sayoko miura
 
Form
FormForm
Web2 mission
Web2 missionWeb2 mission
Web2 mission
sayoko miura
 
Html
HtmlHtml
Table
TableTable
Display
DisplayDisplay
Display
sayoko miura
 
上へ戻る
上へ戻る上へ戻る
上へ戻る
sayoko miura
 

More from sayoko miura (20)

miuratta-standard.pdf
miuratta-standard.pdfmiuratta-standard.pdf
miuratta-standard.pdf
 
group-html
group-htmlgroup-html
group-html
 
html
htmlhtml
html
 
Table
TableTable
Table
 
Child.key
Child.keyChild.key
Child.key
 
Clearfix.key
Clearfix.keyClearfix.key
Clearfix.key
 
Form
FormForm
Form
 
Css selector
Css selectorCss selector
Css selector
 
Prevnext
PrevnextPrevnext
Prevnext
 
This
ThisThis
This
 
Event.key
Event.keyEvent.key
Event.key
 
Readyevent
ReadyeventReadyevent
Readyevent
 
J query ready2.key
J query ready2.keyJ query ready2.key
J query ready2.key
 
WhatsjQuery
WhatsjQueryWhatsjQuery
WhatsjQuery
 
Form
FormForm
Form
 
Web2 mission
Web2 missionWeb2 mission
Web2 mission
 
Html
HtmlHtml
Html
 
Table
TableTable
Table
 
Display
DisplayDisplay
Display
 
上へ戻る
上へ戻る上へ戻る
上へ戻る
 

J query書き方いろいろ