מקודד ומפענח HTML Entities

בצעו escape לטקסט כדי שיהיה בטוח להכניס אותו ל-HTML, או הפכו entities כמו & ו-€ בחזרה לתווים קריאים.

רץ בדפדפן שלכםבלי הרשמהשום דבר לא מועלה

מקודד

איך משתמשים בכלי מקודד / מפענח HTML Entities

  1. בחרו קידוד כדי לבצע escape לטקסט, או פענוח כדי להפוך entities בחזרה לתווים.
  2. בקידוד, בחרו לאילו תווים לבצע escape: רק לתווים המיוחדים של HTML, גם לכל התווים שאינם ASCII, או לכל דבר מלבד אותיות וספרות.
  3. בחרו entities בעלי שם (é), עשרוניים (é) או hex (é).
  4. העתיקו את התוצאה. בפענוח, entities לא מוכרים מופיעים ברשימה כדי שתוכלו לזהות שגיאות הקלדה.

למה לבצע escape ל-HTML?

לחמישה תווים יש משמעות מיוחדת ב-HTML: & פותח entity, ‏< ו-> תוחמים תגיות, ו-" ו-' סוגרים ערכי מאפיינים. אם טקסט שהגיע מהמשתמש ומכיל אותם מוכנס לדף בלי escape, הוא עלול לשבור את הפריסה או, גרוע מכך, להזריק סקריפטים (cross-site scripting,‏ XSS). ה-escape הופך אותם ל-&amp;, &lt;, &gt;, &quot; ו-&#x27;, שהדפדפן מציג כטקסט.

Entities בעלי שם, עשרוניים ו-hex

כל תו Unicode אפשר לכתוב כהפניה מספרית: עשרונית &#8364; או hex‏ &#x20AC; עבור €. לתווים נפוצים רבים יש גם שם קריא, כמו &euro;, &copy; או &nbsp;. הפניות מספריות עובדות בכל מקום, כולל XML, שמגדיר רק חמישה entities בעלי שם. Entities בעלי שם קלים יותר לקריאה בקוד המקור.

האם צריך לקודד תווים שאינם ASCII?

לא, אם הדף מוגש כ-UTF-8, כמו כמעט כל אתר מודרני (<meta charset="utf-8">). תווים כמו é,‏ ü או 日本 אפשר לכתוב ישירות. קידוד שלהם שימושי למערכות ישנות, לתבניות דואר אלקטרוני, או כשצינור עיבוד משבש טקסט שאינו ASCII.

Escape תלוי הקשר

Escape של HTML entities מגן על טקסט שמוצב בתוכן של אלמנט ובמאפיינים עם מירכאות. הוא לא מספיק לערכים בתוך בלוקים של <script>, ב-event handlers מוטמעים, ב-CSS או בכתובות URL, שכל אחד מהם צריך קידוד משלו. העדיפו את ה-auto-escaping של ה-framework שלכם (React,‏ Vue,‏ Jinja,‏ Blade) על פני בניית מחרוזות ידנית.

שאלות נפוצות

לאילו תווים חובה לבצע escape ב-HTML?
בתוכן טקסט, & ו-< הם הכרחיים. בערכי מאפיינים, בצעו escape גם לתו המירכאות שבו השתמשתם. Escape לכל החמישה (& < > " ') הוא ברירת המחדל הבטוחה.
מה זה &amp;nbsp;?
רווח בלתי שביר (U+00A0). הוא נראה כמו רווח אבל מונע שבירת שורה ואינו מתמזג עם רווחים סמוכים.
למה &amp;copy2024 מתפענח ל-©2024?
לשם תאימות לאחור, דפדפנים מפענחים כמה entities ישנים, כמו &copy, &amp ו-&lt, גם בלי נקודה-פסיק בסוף. המפענח הזה פועל לפי אותו כלל. ב-HTML שלכם, תמיד כתבו את הנקודה-פסיק.
הגרש הוא &amp;apos; או &amp;#39;?
&apos; תקין ב-HTML5 וב-XML אבל לא ב-HTML 4, ולכן &#39; או &#x27; המספריים הם הבחירה התואמת ביותר, וזה מה שהמקודד הזה מפיק.

כלים קשורים

קידוד / פענוח URL קידוד/פענוח percent-encoding וניתוח query strings של URL. קידוד ופענוח Base64 קידוד ופענוח Base64 ו-base64url, לטקסט או לקבצים. מכווץ HTML הסרת הערות ורווחים, וכיווץ CSS/JS מוטמעים. בודק Regex בדיקת regex של JavaScript בזמן אמת, עם קבוצות והחלפה.