تبلیغات

لینک دار کردن متن در جاوا اسکریپت

جاوا اسکریپت

لینک دار کردن متن در جاوا اسکریپت


ممکن است بخواهید به صورت داینامیک و البته سمت کلاینت، متنی را داخل صفحه‌ی خود لینک دار کنید.

طرح یک مسئله

برای شروع، کد HTML زیر را در نظر بگیرید:

یک جعبه‌ی متن برای وارد کردن لینک دلخواه توسط کاربر و یک دکمه ایجاد کرده‌ایم! همچنین یک متن با عنوان fullkade در انتهای صفحه قرار داده‌ایم! و حالا قصد داریم وقتی روی دکمه کلیک شد، متن داخل span لینک دار شود.

بنابراین در رویداد onClick دکمه، تابع setLink را فراخوانی می‌کنیم. این تابع را در ادامه توضیح خواهیم داد.

تابع setLink

این تابع، با گرفتن دو ورودی، متن داخل یک المنت را لینک دار می‌کند!

  • ورودی targetId: آیدی المنتی که قصد داریم متن آن را لینک دار کنیم.
  • ورودی link: خود لینک

داخل تابع، ابتدا محتوای المنت هدف را با استفاده از آیدی آن گرفته و داخل متغیر target قرار می‌دهیم؛ سپس محتوای HTML داخل آن را به مقدار جدیدی تغییر می‌دهیم. تنها کافیست به اطراف مقدار قدیمی، تگ‌های لینک a را اضافه کنیم و سپس آن را در داخل target قرار دهیم.

کد نهایی

تبلیغات
2 نظر
کانال تلگرام فول کده
تبلیغات

درباره نویسنده

هادی اکبرزاده

[ مدیر فول کده ]

علاقه‌مند به اشتراک گذاری اطلاعات در هر زمینه‌ای / برنامه‌نویس / مدیر فول کده

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

نظرات ثبت شده 2 دیدگاه

    1. ali گفت:

      با سلام و تشکر بابت مطلب خوبتون

      بنده مارکر و پاپ آپ ی دارم بر روی یک نقشه html
      میخواستم با کدهای اسکریپت، یک از این دو را لینک دارم کنم. یعنی وقتی بر روی مارکر یا پاپ آپ کلیلک میکنیم به یک ادرس وب سایت هدایت شود.
      لطفا بنده را راهنمایی فرمایید.

      1. شما بهتره از کد جاوا اسکریپت برای باز کردن یک لینک استفاده کنینو چیزی رو لینک دار نکنین!