بعد قراءة "طريقة التنفيذ لإنشاء أو إضافة أوراق نمط CSS مع JavaScript" ، من السهل عليك معرفة كيفية تعديل أوراق نمط CSS.
صادفت مقابلة صديق في المنتدى اليوم يطرح هذا السؤال:
<style> .ls {width = 120px ؛} </style> <script> // إضافة جملة هنا لتغيير قيمة العرض في .LS ، كيفية كتابتها </script>أجاب بعض الأصدقاء: "إذا كان هناك العديد من الكائنات التي تستخدم .LS ، فمن غير المريح حقًا استخدام JS ، jQuery مريحة ، $ (". ls "). Width (200) ؛ هذا جيد."
إنه يريد استخدام Selector.ls من فئة JQ لتحديد جميع الكائنات التي تستخدم هذا النمط وضبطها واحدًا تلو الآخر ، بدلاً من تغيير ورقة نمط CSS ، لذلك هناك مخاوف بشأن "الكثير من الكائنات".
لكن المشكلة هي أن هذا يغير فقط نمط التعبير المحدد لتلك الكائنات ، وليس إعدادات .LS. إذا ظهر عنصر آخر باستخدام نمط .LS ، فسيظل هو نفسه. لا تزال بحاجة إلى ضبط هذا العنصر مرة أخرى ، لعلاج الأعراض ولكن ليس السبب الجذري. علاوة على ذلك ، تحدد هذه الطريقة أيضًا أنه من المستحيل تحقيقها ببساطة في جملة واحدة.
هناك عدد غير قليل من الأشخاص الذين يفكرون في هذا الأمر ، وإذا قرأت المقالة "طريقة تنفيذ إنشاء أو إضافة أوراق نمط CSS مع JavaScript" ، أعتقد أنك ستفكر بسهولة في كيفية حل هذه المشكلة في جملة واحدة ، وهي موجزة وفعالة على حد سواء (سيقوم المتصفح تلقائيًا بإعادة ضبط جميع العناصر التي تطبق هذا الأسلوب) ، وتعديل الإعدادات النمطية. ستطبق العناصر المضافة حديثًا التي تستخدم هذا النمط تلقائيًا الإعدادات المعدلة. لذلك ، لقد تعلمت المعرفة ذات المستوى الأعلى والتي تتميز عن العديد من الناس. اسمحوا لي أن أشرح الطريقة بالتفصيل أدناه:
بسبب المثال أعلاه ، ليس من السهل رؤية التأثير. لقد كتبت مثالًا آخر أدناه. من الأسهل رؤية التأثير من خلال تغيير اللون:
<style> .theforever {width: 50px ؛ color: red ؛}#theferver {width: 150px ؛ color: silver ؛} </style> <viv> يجب أن يكون أحمر هنا ، ولكن سيتم تحويله إلى اللون الأصفر بواسطة JS أدناه عن طريق تغيير إعدادات نمط CSS <//div id = "the forriter"> يجب أن يكون الفضة هنا. في الواقع ، لن يتغير هذا ، فقط للمقارنة </div> <script> document.stylesheets [0] .csStext = document.stylesheets [0] .csstext.replace (/red/g ، "أصفر") ؛ // أليس كذلك؟ </script>لا يهدف المثال أعلاه إلى اسم نمط معين ، ولكن الألوان العامة (إذا قمت بنقلها مباشرة إلى صفحة CSS أكثر تعقيدًا مع كلمات حمراء لا تشير إلى الألوان ، فقد يؤدي ذلك أيضًا إلى أخطاء.
من ما سبق ، يمكننا أن نرى هذا المستند. لذلك إذا كنت تريد تغيير إعداداتها لـ .LS ، فأنت بحاجة فقط إلى استخدام ".ls {width = 120px ؛}" كجزء استبدال لاستبدال و ".ls {width = 555px ؛}" كهدف استبدال ، وهذا جيد.
المقالة أعلاه حول كيفية تعديل أوراق نمط CSS مع JavaScript هي كل المحتوى الذي أشاركه معك. آمل أن يعطيك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.