کاهش حجم کد جاوا اسکریپت
درود دوستان...
می خوام یه کتابخانه برای منو کردن سایدبار استفاده کنم ولی مشکلی که داره بخواهیم دکمه ها صدا بزنیم باید چند سطر کد ایجاد کنم و همین جوری حجم کد زیاد میشه...
کد HTML
مثلا دو تا دکمه منو ایجاد کردم:
<button id="slide-1-trigger">Slide 1 Trigger</button>
<div id="slide-1-target">
Slide 1 content
</div>
<button id="slide-2-trigger">Slide 1 Trigger</button>
<div id="slide-2-target">
Slide 1 content
</div>کد جاوا اسکریپت
برای صدا زدن آن باید دو تا کد زیر با آی دی متفاوت ایجاد کنیم:
document.getElementById('slide-1-trigger').addEventListener('click', async function () {
await slideToggle(document.getElementById('slide-1-target'));
console.log('done')
})
document.getElementById('slide-2-trigger').addEventListener('click', async function () {
await slideToggle(document.getElementById('slide-2-target'));
console.log('done')
})حالا اگر بخوام ۱۰ تا دکمه منو ایجاد کنم باید مثل این کد صدا زدن دکمه ها به صورت بنویسم که حجم کد زیاد میشه...
چجوری این ۱۰ تا دکمه بخوام صدا بزنم در یک کد نوشته بشه....
گزینش سوالات
گفت و گو های مرتبط
دسته بندی سوالات
تگ‌های محبوب
function toggle_menu(id , idTarget){
document.getElementById(id).addEventListener('click', async function () {
await slideToggle(document.getElementById(idTarget));
console.log('done')
})
}
toggle_menu('slide-1-trigger' , 'slide-1-target');
toggle_menu('slide-2-trigger' , 'slide-2-target');فک کنم اون کد دوستمون قسمت ایدی دوم رو توجه نکردن چون ایدیش فرق میکرد باید یه ورودی دیگه برای اون ایدی هم میگرفتیم
الان فک کنم درسته دیگه
سلام خب یه فانکشن بسازید و به عنوان ارگومان ایدی منو رو بدید و کدتون رو بزارید تو فانکشن
کد شما
function toggle_menu(id){
document.getElementById(id).addEventListener('click', async function () {
await slideToggle(document.getElementById(id));
console.log('done')
})
}
toggle_menu('slide-1-trigger')
toggle_menu('slide-2-trigger')
@mohammadphp
کد کار کرد ولی یه اشکال داره...
این دکمه ها رو hide می کنه و بکگراند صفحه خیر ...
این دو تا باید یک جا عمل کنه
function toggle_menu(id , idTarget){
document.getElementById(id).addEventListener('click', async function () {
await slideToggle(document.getElementById(idTarget));
console.log('done')
})
}
toggle_menu('slide-1-trigger' , 'slide-1-target');
toggle_menu('slide-2-trigger' , 'slide-2-target');فک کنم اون کد دوستمون قسمت ایدی دوم رو توجه نکردن چون ایدیش فرق میکرد باید یه ورودی دیگه برای اون ایدی هم میگرفتیم
الان فک کنم درسته دیگه