jQuery စာကြည့်တိုက်နှင့် လက်တွေ့ကျင့်သုံးခြင်း
b tag ပါရှိသော p စာပိုဒ်အားလုံးကို div tag ဖြင့် wrap လုပ်ပါ။
www class ရှိသော p စာပိုဒ်များအားလုံးကို ရှာပါ၊ ၎င်းတို့၏အစတွင် '!' စာသားကို ထည့်ပါ၊ ထို့နောက် ထိုစာပိုဒ်များထဲသို့ h1-h6 ခေါင်းစဉ်များကို ထပ်ထည့်ပြီး ထိုစာပိုဒ်များနှင့် ခေါင်းစဉ်များကို အနီရောင်ဖြင့် ခြယ်ပါ။
p စာပိုဒ်အားလုံးကို ရှာပြီး ၎င်းတို့ကို ၎င်းတို့၏အကြောင်းအရာအတိုင်းပင် ပါရှိသော div tag ဖြင့် အစားထိုးပါ။
စာမျက်နှာပေါ်ရှိ အမှန်ခြစ်ကွက်များအားလုံးကို ရှာပြီး ရှာတွေ့သော အရာများအနက် စုံနံပါတ်များကို ပိတ်ပင်ပါ။
မပိတ်ပင်ထားသော
အမှန်ခြစ်ကွက်များအားလုံးကို
'အမှန်ခြစ်ထားသော' အခြေအနေသို့ ပြောင်းပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏ တိုက်ရိုက်အထက် အနီးအနားရှိ element ကို '!' စာသားဖြင့် ပြသပါ၊ အောက်ဘက်ရှိ အနီးအနားကိုမူ '?' စာသားဖြင့် ပြသပါ။ လေ့ကျင့်ခန်းကို တစ်ကြောင်းတည်းဖြင့် ဖြေရှင်းပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏ တိုက်ရိုက်အထက် နှင့် အောက်ဘက်ရှိ အနီးအနားများကို #test element ၏ စာသားဖြင့် ပြသပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏ အထက်ဘက်ရှိ အနီးအနားများအနက် အနီးဆုံးစာပိုဒ်ကို ရှာပြီး ၎င်းကို #test element ၏ စာသားဖြင့် ပြသပါ။
စာမျက်နှာပေါ်ရှိ ဒုတိယမြောက် li ကို ရှာပါ၊
၎င်းကို www class ထည့်ပါ၊ ၎င်းကို အတွင်းမှ i tag ဖြင့် wrap လုပ်ပါ၊ ၎င်း၏နောက်တွင်
'မင်္ဂလာပါ' စာသားပါရှိသော li တစ်ခု ထည့်သွင်းပါ။
စာမျက်နှာပေါ်ရှိ ဒသမမြောက် li ကို ရှာပါ၊
၎င်း၏ မိဘ element ကို ရှာပါ၊ မိဘ element ၏ တိုက်ရိုက်အထက် အနီးအနားကို ရယူပါ၊ ၎င်းကို
<div class="www"></div> ဖြင့် wrap လုပ်ပါ။
www class မရှိသော p စာပိုဒ်များမှလွဲ၍ စာပိုဒ်တိုင်း၏
အဆုံးတွင် ၎င်း၏ အစဉ်လိုက်နံပါတ်ကို ထည့်သွင်းပါ။
p စာပိုဒ်အားလုံးကို ရှာပြီး စာပိုဒ်တိုင်းမှ ရှေ့တွင် ၎င်း၏ copy ကို ထားပါ။ Copy ကို
အနီရောင်ဖြင့် ခြယ်ပါ၊ မူရင်းစာပိုဒ်ကို စိမ်းရောင်ဖြင့် ခြယ်ပါ။
h2 ၏ တိုက်ရိုက်အောက်တွင် ရှိနေသော p စာပိုဒ်များကို ရှာပါ
ပြီးနောက် စာပိုဒ်တိုင်းကို
h2 ၏ တိုက်ရိုက်အပေါ်တွင် ရှိစေရန် ရွှေ့ပါ။
ဗလာ p စာပိုဒ်များ (စာသားမရှိ) အားလုံးကို ရှာပြီး ၎င်းတို့အတွင်း
တိုက်ရိုက်အထက်ဘက်ရှိ အနီးအနား element ၏ စာသားကို ထည့်သွင်းပါ။
b tag ၏ မိဘ element သည် www class ရှိသော element သို့မဟုတ် p
စာပိုဒ်ဖြစ်ပါက ၎င်းကို အနီရောင်ဖြင့် ခြယ်ပြီး
စာသားအရွယ်အစားကို
30px သတ်မှတ်ပါ။
ဗလာ p စာပိုဒ်အားလုံးကို ၎င်းတို့၏ အထက်ဘက်သို့ အနီးဆုံး
h2 tag ၏ စာသားဖြင့် ပြသပါ။
နံပါတ်များပါရှိသော ထည့်သွင်းရန် အကွက်များကို ပေးထားသည်။ ထည့်သွင်းရန် အကွက်များအတွင်း ထိုနံပါတ်များ၏ နှစ်ထပ်ကိန်းများ ရှိနေစေပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏အစတွင် တိုက်ရိုက်အထက်ဘက်ရှိ အနီးအနား၏ စာသားကို ထည့်ပါ၊ ပြီးနောက် အဆုံးတွင်
- တိုက်ရိုက်အောက်ဘက်ရှိ အနီးအနား၏ စာသားကို ထည့်ပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏ အထက်ဘက်ရှိ ဒုတိယမြောက် အနီးအနားနှင့် အောက်ဘက်ရှိ ဒုတိယမြောက် အနီးအနားကို ရှာပါ။ ရှာတွေ့သော element များ
စာသားများ ဖလှယ်စေပါ (အထက်ဘက်ရှိ အနီးအနားသည် အောက်ဘက်ရှိ အနီးအနား၏ စာသားကို ယူပြီး ပြောင်းပြန်အတိုင်း ဖြစ်စေပါ)။
div element ကို ပေးထားသည်။ ၎င်းမှ
ခေါင်းစဉ်များ မဟုတ်သော တိုက်ရိုက် child များအားလုံးကို ရွေးချယ်ပြီး
အနီရောင်ဖြင့် ခြယ်ပါ။
p စာပိုဒ်အားလုံးကို ရှာပြီး အနီရောင်ခြယ်ပါ။ ထို့နောက် ရှာတွေ့သော စာပိုဒ်များအနက်
www class ရှိသော စာပိုဒ်များကို ရွေးပြီး ၎င်းတို့ကို
'!' စာသားဖြင့် ပြသပါ။
www class ရှိသော p စာပိုဒ်အားလုံးကို ရှာပြီး အနီရောင်ခြယ်ပါ။
ထို့နောက် ရှာတွေ့သော စာပိုဒ်များအနက် ပထမဆုံးစာပိုဒ်ကို ရွေးပြီး
'!' စာသားဖြင့် ပြသပါ၊ ထို့နောက် နောက်ဆုံးစာပိုဒ်ကို ရွေးပြီး ၎င်းကို
'?' စာသားဖြင့် ပြသပါ။
လေ့ကျင့်ခန်းကို တစ်ကြောင်းတည်းဖြင့် ဖြေရှင်းပါ။
p စာပိုဒ်အားလုံးကို ရှာပြီး ၎င်းတို့ထဲမှ စာပိုဒ်တိုင်း၏
အဆုံးတွင် ၎င်းတွင်ရှိသော စာသားအတိုင်း ထည့်ပါ (ဆိုလိုသည်မှာ စာပိုဒ်ထဲရှိ စာသားသည်
နှစ်ကြိမ်ရေးထားသကဲ့သို့ ဖြစ်နေမည်)။
p စာပိုဒ်အားလုံးကို ရှာပြီး ၎င်းတို့ထဲမှ စာပိုဒ်တိုင်း၏
အဆုံးတွင် စုစည်းမှုအတွင်း ၎င်း၏ အစဉ်လိုက်နံပါတ်ကို ထည့်ပါ။
နံပါတ်များပါရှိသော စာပိုဒ်များကို ပေးထားသည်။ ၎င်းတို့ထဲမှ စာပိုဒ်တိုင်း၏ အဆုံးတွင် ၎င်းထဲတွင် သိမ်းဆည်းထားသော နံပါတ်ကို ၎င်း၏ စုစည်းမှုအတွင်း အစဉ်လိုက်နံပါတ်ဖြင့် မြှောက်ထားသော နံပါတ်ကို ထည့်ပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ တိုက်ရိုက်အထက် နှင့်
အောက်ဘက်ရှိ အနီးအနားများကို ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အထက်ဘက်ရှိ အနီးအနားများအားလုံးကို
ပထမဆုံး ခေါင်းစဉ် h1-h6 (ဆိုလိုသည်မှာ ဤခေါင်းစဉ်၏ အထက်တွင် ရှိနေသော element များနှင့်
ခေါင်းစဉ်ကိုယ်တိုင်ကို ဖယ်ရှားရန် မလိုအပ်ပါ) ထိ ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အောက်ဘက်ရှိ အနီးဆုံး
www class ရှိသော အနီးအနားကို ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အောက်ဘက်ရှိ ပဉ္စမမြောက်
အနီးအနားကို ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အောက်ဘက်ရှိ ပဉ္စမမြောက်
အနီးအနား သည် h2 မဟုတ်ပါက ၎င်းကို ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အောက်ဘက်ရှိ ပဉ္စမမြောက်
အနီးအနားထဲတွင် b tag မရှိပါက ၎င်းကို ဖယ်ရှားပါ။
p စာပိုဒ်တစ်ခုကို နှိပ်လိုက်သည့်အခါ ၎င်း၏ အောက်ဘက်ရှိ ပဉ္စမမြောက်
အနီးအနားသည် h2 ၏ တိုက်ရိုက်နောက်တွင် မရှိပါက ၎င်းကို ဖယ်ရှားပါ။
#test element ကို ပေးထားသည်။ ဤ element ကို ၎င်း၏ တိုက်ရိုက်အောက်ဘက်ရှိ
အနီးအနားနှင့် နေရာလဲလှယ်ပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏ တိုက်ရိုက်အောက်ဘက်ရှိ အနီးအနား၏
နောက်တွင် ကျွန်ုပ်တို့ element ၏ copy တစ်ခုကို ထည့်သွင်းပါ။
#test element ကို ပေးထားသည်။ ဤ element ကို ၎င်း၏ အောက်ဘက်ရှိ အနီးဆုံး
www class ရှိသော အနီးအနားနှင့် နေရာလဲလှယ်ပါ။
p စာပိုဒ်အားလုံးကို ရှာပါ၊ ၎င်းတို့သည်
တူညီသော မိဘ element အတွင်း ၎င်းနှင့် နောက်ထပ် h2 ကြားတွင် တည်ရှိသည်။
p စာပိုဒ်တိုင်းကို အပြင်ဘက်နှင့် အတွင်းဘက်မှ div ဖြင့် wrap လုပ်ပါ။
p စာပိုဒ်အားလုံးကို ရှာပါ၊ ၎င်းတို့၏
တိုက်ရိုက်မိဘ element သည် div မဟုတ်ပါက
စာပိုဒ်တိုင်းကို <div class="www"></div> ဖြင့် wrap လုပ်ပါ။
p စာပိုဒ်အားလုံးကို ရှာပါ။ ၎င်းတို့၏ မိဘ element ကို ဖယ်ရှားပါ (၎င်းကို unwrap လုပ်ပါ)၊
သို့မဟုတ် ထိုမိဘ element သည် www class ရှိသော div မဟုတ်ပါက။ ထို့နောက် မိဘ element ဖယ်ရှားခံရသော
စာပိုဒ်များကို zzz class ရှိသော div ဖြင့် wrap လုပ်ပါ။
#test element ၏ မိဘ element အားလုံးကို ရှာပြီး ထိုမိဘများ၏
CSS class များပါရှိသော array တစ်ခု ဖန်တီးပါ။
class attribute ရှိသော p စာပိုဒ်အားလုံးကို ရှာပါ၊ ပြီးနောက် စာပိုဒ်တိုင်းကို
ရှာတွေ့သော စာပိုဒ်၏ class များအတိုင်းပင် ရှိသော class များဖြင့် div ဖြင့် wrap လုပ်ပါ၊ စာပိုဒ်တိုင်း၏
class များကို class attribute နှင့်အတူ ဖယ်ရှားပါ။
#test အတွင်းရှိ p စာပိုဒ်အားလုံးကို ရှာပါ၊ ၎င်းတို့၏အဆုံးတွင်
'!' စာသားကို ထည့်ပါ၊ ထို့နောက် ရှာတွေ့သော စာပိုဒ်များမှ
www class ရှိသော စာပိုဒ်များကို ချန်လှပ်ပြီး ကျန်ရှိသော စာပိုဒ်များကို
အနီရောင်ခြယ်ပါ။
စာမျက်နှာပေါ်ရှိ li အားလုံးကို ရှာပါ၊
ထို့နောက် ရှာတွေ့သော အရာများထဲမှ နောက်ဆုံးမတိုင်မီရှိ element ၏ ရှေ့တွင်
'အမှတ်' စာသားပါရှိသော အခြား li တစ်ခု ထည့်သွင်းပါ။
စာမျက်နှာပေါ်ရှိ li အားလုံးကို ရှာပါ၊
ထို့နောက် ရှာတွေ့သော အရာများထဲမှ နောက်ဆုံးမှ ဒုတိယ၊ တတိယ
နှင့် စတုတ္ထမြောက်များကို ရွေးပြီး ၎င်းတို့ကို
'!' စာသားဖြင့် ပြသပါ။
#test ပါရှိသော ol ကို ရှာပြီး
၎င်းအတွင်းရှိ li အားလုံးကို
ပြောင်းပြန်အစဉ်အတိုင်း ပြန်စီပါ။
#test element ကို ပေးထားသည်။ ၎င်း၏
အထက်ဘက်ရှိ အနီးအနားအားလုံးနှင့် အောက်ဘက်ရှိ အနီးအနားအားလုံးကို ရှာပြီး
၎င်းတို့၏ နေရာများကို လဲလှယ်ပါ (ဆိုလိုသည်မှာ element မတိုင်မီက ရှိသမျှသည်
၎င်း၏နောက်တွင် ရှိရမည်၊ ပြောင်းပြန်အတိုင်း ဖြစ်ရမည်)။
www class ရှိသော li အားလုံးကို ရယူပါ၊ ၎င်းတို့ကို အနီရ