أعلم أنّك تكتب الشيفرة كمثال، البعض فقط قد يتعلم منها الأخطاء، نبهني استخدامك innerHTML مع مُتغير أسميته DOM، ثم NodeList.forEach إلى شيفرة تبدو سيئة :)

1. إياك أن تسمي مُتغير باسم قياسي DOM، حسبتك تقصد توثيقة الصفحة، المتغير بهذا الاسم غير قابل للقراءة.

2. querySelectorAll ترجع NodeList هو ليس مصفوفة، لذا querySelectorAll().forEach لن تأتي من Array.prototype.forEach بل من NodeList.prototype.forEach وهذا التابع مدعوم فقط في كروم 51+ حتى الآن، استخدم for of، أو Array.prototype.forEach.

3. لا تستخدم innerHTML لإضافة عناصر HTML أبدًا أبدًا، تحدث الكثير من الأخطاء، الكثير من الإختلافات، وهذه طريقة سيئة لتعديل الـDOM، إذا كان يدعم الوصول بطريقة قياسية.

4. بما أنك تعد من الواحد لِما تعد في الدوران من الصفر لم أفهم هذا :)

مثل هذه قد تكون أفضل:

var ratings = document.querySelectorAll(".rating span[stars]");

Array.prototype.forEach.bind(ratings)((root) => {
    let par = root.getAttribute("stars").split(","),
        max = parseInt(par[1]),
        val = parseInt(par[0]);

    for(let i=1; i<=max; i++){
        let star = document.createElement("span");

        star.textContent = val<i ? '0':'*';
        root.appendChild(star);
    }
});

شكرا على المشاركة

نعم كنت سأضع كود angularJs لاحقا طريقة قوية لتسهيل العرض باستخدام directives لكن ربما قد لا يعرف استخدامها من لم يتعلم مكتبة angularJs

لكن وضعت كود php للمبتدئين والجدد في هذه اللغة حتى يكون سهل جدا

بالمناسبة

هل هذا كود reactJs او angularJs 2 ؟

جميل

هل يمكنك شرح الكود اكثر ومامعنى هذه الكتابة

nth-child(-n+5)

أبدعت وشكرا لمجهود