အရာဝတ္ထုများကို တစ်ပြိုင်နက် တည်းဖြတ်ခြင်းနှင့် ဖျက်ခြင်း

ကျွန်ုပ်တို့တွင် အောက်ပါအပိုဒ်များ ရှိသည်ဆိုပါစို့။

<div id="parent">
	<p>text1</p>
	<p>text2</p>
	<p>text3</p>
</div>

ဤအပိုဒ်များအတွက် အပိုဒ်တစ်ခုစီ၏ စာသားကို တည်းဖြတ်နိုင်ပြီး အပိုဒ်တစ်ခုစီ၏ အဆုံးတွင် ဖျက်ရန် လင့်ခ်တစ်ခု ထည့်ပေးကြပါစို့။

ဖော်ပြပါ အလုပ်တာဝန်ကို အကောင်အထည်ဖော်ရာတွင် ကျွန်ုပ်တို့သည် ပြဿနာတစ်ခုနှင့် ရင်ဆိုင်ရလိမ့်မည်။

ပြဿနာ၏ အရင်းအမြစ်ကို နားလည်ရန်၊ အပိုဒ်တစ်ခုစီ၏ အဆုံးသို့ ဖျက်ရန် လင့်ခ်များ ထည့်သွင်းပြီးနောက် ရလာမည့် HTML ကုဒ်ကို ကြည့်ကြပါစို့။

<div id="parent">
	<p>text1<a href="">remove</a></p>
	<p>text2<a href="">remove</a></p>
	<p>text3<a href="">remove</a></p>
</div>

ယခု စိတ်ကူးကြည့်ပါ၊ မည်သည့်အပိုဒ်ကိုမဆို နှိပ်လိုက်သည်နှင့် ၎င်းတွင် စာသားတည်းဖြတ်ရန် input တစ်ခု ပေါ်လာလိမ့်မည်။ ဤသို့ဆိုလျှင် input ထဲသို့ အပိုဒ်၏ စာသားအားလုံး - ဖျက်ရန် လင့်ခ်နှင့်အတူ - ဝင်ရောက်သွားလိမ့်မည်။

ဤသို့ဖြစ်ခြင်းသည် မှန်ကန်သည်ဟု မဆိုနိုင်ပါ။

ပိုမိုကောင်းမွန်သော ဖြေရှင်းချက်မှာ အပိုဒ်စာသားများကို span tag များဖြင့် ထည့်သွင်းရေးသားခြင်း ဖြစ်သည်၊ ဤကဲ့သို့ပင်ဖြစ်သည်။

<div id="parent">
	<p><span>text1</span><a href="">remove</a></p>
	<p><span>text2</span><a href="">remove</a></p>
	<p><span>text3</span><a href="">remove</a></p>
</div>

ထိုကဲ့သို့သော ကုဒ်အတွက် တည်းဖြတ်ခြင်း event ကို အပိုဒ်တစ်ခုလုံးပေါ်တွင် မထည့်ဘဲ စာသားပါရှိသော span ပေါ်တွင် ထည့်နိုင်သည်။ ဤနည်းဖြင့် တည်းဖြတ်ရန် input သည် span tag အတွင်းတွင် ပေါ်လာမည်ဖြစ်ပြီး ကျွန်ုပ်တို့၏ ဖျက်ရန် လင့်ခ်မှာ မထိခိုက်ဘဲ ကျန်ရှိနေမည်။

အောက်ပါ HTML ကုဒ် ရှိပါသည်။

<div id="parent">
	<p><span>text1</span></p>
	<p><span>text2</span></p>
	<p><span>text3</span></p>
</div>

ဖျက်ရန် လင့်ခ်ကို အပိုဒ်တစ်ခုစီ၏ အဆုံးတွင် ထည့်ပါ။

span ကို နှိပ်လိုက်သောအခါ ၎င်းအတွင်းတွင် တည်းဖြတ်ရန် input တစ်ခု ပေါ်လာစေရန် ပြုလုပ်ပါ။

ယခု အစတွင် span tag များ မရှိပါစို့။

<div id="parent">
	<p>text1</p>
	<p>text2</p>
	<p>text3</p>
</div>

ပထမဦးစွာ အပိုဒ်စာသားကို span tag များဖြင့် ထည့်သွင်းရေးပါ၊ ထို tag များအား တည်းဖြတ်နိုင်စွမ်း ထည့်သွင်းပေးပါ၊