152 lines
8.1 KiB
Markdown
152 lines
8.1 KiB
Markdown
|
---
|
|||
|
|
title: Convert HTML Entities
|
|||
|
|
localeTitle: تحويل كيانات HTML
|
|||
|
|
---
|
|||
|
|
|
|||
|
|
|
|||
|
|
 تذكر استخدام **`Read-Search-Ask`** إذا واجهتك مشكلة. حاول إقران البرنامج  واكتب الكود الخاص بك 
|
|||
|
|
|
|||
|
|
###  شرح المشكلة:
|
|||
|
|
|
|||
|
|
* يجب عليك إنشاء برنامج يقوم بتحويل كيانات HTML من السلسلة إلى كيانات HTML الخاصة بها. لا يوجد سوى عدد قليل حتى تتمكن من استخدام أساليب مختلفة.
|
|||
|
|
|
|||
|
|
##  تلميح: 1
|
|||
|
|
|
|||
|
|
* يمكنك استخدام تعبيرات عادية ومع ذلك لم أكن في هذه الحالة.
|
|||
|
|
|
|||
|
|
> _حاول أن تحل المشكلة الآن_
|
|||
|
|
|
|||
|
|
##  تلميح: 2
|
|||
|
|
|
|||
|
|
* ستستفيد من مخطط يحتوي على جميع كيانات html حتى تعرف أيها الكيانات المناسبة لوضعها.
|
|||
|
|
|
|||
|
|
> _حاول أن تحل المشكلة الآن_
|
|||
|
|
|
|||
|
|
##  تلميح: 3
|
|||
|
|
|
|||
|
|
* يجب فصل السلسلة والعمل مع كل حرف لتحويل الأحرف الصحيحة ثم الانضمام إلى كل شيء احتياطيًا.
|
|||
|
|
|
|||
|
|
> _حاول أن تحل المشكلة الآن_
|
|||
|
|
|
|||
|
|
## تنبيه المفسد!
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
**الحل في المستقبل!**
|
|||
|
|
|
|||
|
|
##  الحل الأساسي للكود:
|
|||
|
|
|
|||
|
|
` function convertHTML(str) {
|
|||
|
|
// Split by character to avoid problems.
|
|||
|
|
|
|||
|
|
var temp = str.split('');
|
|||
|
|
|
|||
|
|
// Since we are only checking for a few HTML elements I used a switch
|
|||
|
|
|
|||
|
|
for (var i = 0; i < temp.length; i++) {
|
|||
|
|
switch (temp[i]) {
|
|||
|
|
case '<':
|
|||
|
|
temp[i] = '<';
|
|||
|
|
break;
|
|||
|
|
case '&':
|
|||
|
|
temp[i] = '&';
|
|||
|
|
break;
|
|||
|
|
case '>':
|
|||
|
|
temp[i] = '>';
|
|||
|
|
break;
|
|||
|
|
case '"':
|
|||
|
|
temp[i] = '"';
|
|||
|
|
break;
|
|||
|
|
case "'":
|
|||
|
|
temp[i] = "'";
|
|||
|
|
break;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
temp = temp.join('');
|
|||
|
|
return temp;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//test here
|
|||
|
|
convertHTML("Dolce & Gabbana");
|
|||
|
|
`
|
|||
|
|
|
|||
|
|
### شرح الشفرة:
|
|||
|
|
|
|||
|
|
اشرح الحل هنا وأضف أي روابط ذات صلة
|
|||
|
|
|
|||
|
|
#### روابط ذات صلة
|
|||
|
|
|
|||
|
|
* [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
|
|||
|
|
* [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
|
|||
|
|
* [بيان التبديل](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch)
|
|||
|
|
|
|||
|
|
 [تشغيل الكود](https://repl.it/CLnP/0)
|
|||
|
|
|
|||
|
|
##  حل الشفرة المتوسطة:
|
|||
|
|
|
|||
|
|
`function convertHTML(str) {
|
|||
|
|
//Chaining of replace method with different arguments
|
|||
|
|
str = str.replace(/&/g,'&').replace(/</g,'<').replace(/>/g,'>').replace(/"/g,'"').replace(/'/g,"'");
|
|||
|
|
return str;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// test here
|
|||
|
|
convertHTML("Dolce & Gabbana");
|
|||
|
|
`
|
|||
|
|
|
|||
|
|
 [تشغيل الكود](https://repl.it/CLnQ/0)
|
|||
|
|
|
|||
|
|
### شرح الشفرة:
|
|||
|
|
|
|||
|
|
اشرح الحل هنا وأضف أي روابط ذات صلة
|
|||
|
|
|
|||
|
|
#### روابط ذات صلة
|
|||
|
|
|
|||
|
|
* [str.replace ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/replace)
|
|||
|
|
* [التعبيرات العادية](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp)
|
|||
|
|
|
|||
|
|
##  الحل المتقدم للكود:
|
|||
|
|
|
|||
|
|
` function convertHTML(str) {
|
|||
|
|
// Use Object Lookup to declare as many HTML entities as needed.
|
|||
|
|
htmlEntities={
|
|||
|
|
'&':'&',
|
|||
|
|
'<':'<',
|
|||
|
|
'>':'>',
|
|||
|
|
'"':'"',
|
|||
|
|
'\'':"'"
|
|||
|
|
};
|
|||
|
|
//Use map function to return a filtered str with all entities changed automatically.
|
|||
|
|
return str.split('').map(entity => htmlEntities[entity] || entity).join('');
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// test here
|
|||
|
|
convertHTML("Dolce & Gabbana");
|
|||
|
|
`
|
|||
|
|
|
|||
|
|
 [تشغيل الكود](https://repl.it/CLnR/0)
|
|||
|
|
|
|||
|
|
### شرح الشفرة:
|
|||
|
|
|
|||
|
|
* قم بإنشاء كائن لاستخدام وظيفة البحث للعثور على الأحرف بسهولة.
|
|||
|
|
* تقسيم السلسلة الأصلية حسب الأحرف واستخدام الخريطة للتحقق من كيان html الذي تم تغييره أو استخدام نفس الوحدة. بدلا من ذلك يمكنك استخدام Regex `str.replace(/&|<|>|"|'/gi` .
|
|||
|
|
* تتم إضافة الوظيفة التي تقوم بإرجاع الكيان المحول أو الأصل إذا لم يكن هناك تحويل. إذا قمت بالانتقال إلى مسار regex ، فعليك فقط إرجاع النتائج المتطابقة. `return html[entity];`
|
|||
|
|
* وأخيرًا نشارك جميع الشخصيات مرة أخرى.
|
|||
|
|
|
|||
|
|
**لاحظ** أنه إذا قمت بالانتقال إلى مسار regex فإنك لن تحتاج إلى الانضمام إلى أي شيء ، فقط تأكد من إرجاع العملية بأكملها أو حفظها إلى متغير ثم إعادتها.
|
|||
|
|
|
|||
|
|
#### روابط ذات صلة
|
|||
|
|
|
|||
|
|
* [str.split ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split)
|
|||
|
|
* [arr.map ()](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map)
|
|||
|
|
* [arr.join ()](https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Array/join)
|
|||
|
|
|
|||
|
|
##  ملاحظات للمساهمات:
|
|||
|
|
|
|||
|
|
*  **لا تقم** بإضافة حلول مشابهة لأي حلول موجودة. إذا كنت تعتقد أنها **_مشابهة ولكن أفضل_** ، فحاول دمج (أو استبدال) الحل المشابه الموجود.
|
|||
|
|
* أضف شرحًا لحلك.
|
|||
|
|
* تصنيف الحل في واحدة من الفئات التالية - **الأساسي** **والمتوسط** **والمتقدم** . 
|
|||
|
|
* الرجاء إضافة اسم المستخدم الخاص بك فقط إذا قمت بإضافة أي **محتويات رئيسية ذات صلة** . (  **_لا_** _تزيل أي أسماء مستخدمين حالية_ )
|
|||
|
|
|
|||
|
|
> نرى  [**`Wiki Challenge Solution Template`**](http://forum.freecodecamp.com/t/algorithm-article-template/14272) كمرجع.
|