این آموزش در تاریخ ۱۴۰۲/۰۶/۲۳ آپدیت شده است.
آموزش تگ template در HTML
سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ template در HTML با من همراه باشید.
Free-Learn
آنچه در این جلسه میخوانید :
تگ Template در HTML
تگ template
تگی است که با استفاده از آن میتوان یک محتوا را در یک صفحه وب قرار داد ولی از بارگذاری همزمان آن با بارگذاری صفحه و نمایش آن در مرورگرها جلوگیری کرد.
اینو همیشه بدونید که بصورت عادی وقتی یک صفحه درون مرورگر اجرا میشه، تمامی تگ های داخل صفحه هم در مرورگر بصورت خودکار اجرا ( رندر یا Render ) میشن.
حال تگ template و هرچیزی که داخلش بزاریم ، دیگه به محض بالا اومدن صفحه اجرا نمیشه، بلکه باید خودمون بصورت دستی اونو اجرا ( نمایش ) بدیم، که معمولا از جاوا اسکرپیت برای نمایش محتوای تگ template استفاده میشه.
Free-Learn
مثال از تگ template در HTML
در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.
مثال شماره ۱ : استفاده از تگ template
همونطور که گفتم بصورت عادی هرچیزی که داخل تگ template قرار داشته باشه در مرورگر نشون داده نمیشه و ما باید خودمون از طریق جاوااسکریپت اونو به نمایش درآوریم.
1 2 3 4 |
<template id="MyTemplate"> <h2>سایت آموزشی فری لرن</h2> <img src="files/logo.png" width="90"> </template> |
Free-Learn
پشتیبانی مرورگرها
در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ template
در HTML پشتیبانی میکنند یا خیر.
نام مرورگر | Chrome | Firefox | Opera | Safari | Edge |
پشتیبانی | بله | بله | بله | بله | بله |
Free-Learn
پشتیبانی از صفات و رویدادهای عمومی
تگ template
تنها از صفات عمومی در HTML پشتیبانی می کند.
Free-Learn
نکات و توضیحات
- معمولا از جاوااسکریپت یا جی کوئری برای نمایش دادن تگ template استفاده میشه، و به محض نمایش این تگ ، همون لحظه هم در مرورگر رندر ( Render ) میشه.