با Prism هر کدی را HIGHLIGHT کنید

برای Highlight کردن کد چند تا کتابخونه خیلی خوب در js وجود داره مثل Prism, highlight و Rainbow

من به چند دلیل Prism رو انتخاب کردم اولیش اینکه این کتابخونه تقریبن از بیشتر زبان های برنامه نویسی رایچ پشتیبابی میکنه بعد اینکه کتابخونه Rainbow از Prism استفاده میکنه و اینکه از ترکیب رنگش نسبت به کتابخونه highlight بیشتر خوشم اومد.

شروع کار خیلی راحت هست کافیه اسکریپت و استایل کتابخونه را به صفحه اضافه کنیم

بعد هر کدی را که میخواید highlight کنیم را در ساختار زیر قرار بدید

برای مثال

به این صورت به طور خودکار کدها Highlight میشن

برای اینکه محتویات اضافه شده جدید به صفحه رو Highlight کنید میتونید از کد زیر استفاده کنید

و یا از کد زیر استفاده کنید تا کل صفحه رو اسکن کنه

این کدی که مثال زدم در Api این کتابخونه هست ولی من هرکاری کردم یکی از دو خطای زیر رو میداد

به یک طریق دیگه تونستم این کار را انجام بدم

اگه قرار هست اینطوری کد را به صورت دستی به یکی از سه روش بالا  highlight کنید باید مقدار data-manual رو به تگ script اضافه کنید تا Prism به صورت خودکار کدها را highligh نکنه و dom رو اسکن نکنه.

چند تا محدودیت هم داره این کتابخونه از جمله اینکه از IE نسخه ۶ تا ۸ پشتیبانی نمیکنه.

تو سایت اصلی کتابخونه هم میتونید زبان های پشتیبانی شده رو ببینید هم Prism رو به صورت سفارشی شده (استایلها و تنظیمات مختلف) دانلود کنید.

جستجو در کل مطالب سایت

نوشته های مشابه