المحدد ‎‎‎:lang()‎‎ في jQuery

من موسوعة حسوب
< jQuery
مراجعة 21:13، 29 مايو 2018 بواسطة جميل-بيلوني (نقاش | مساهمات) (إضافة محتويات الصفحة.)
(فرق) → مراجعة أقدم | المراجعة الحالية (فرق) | مراجعة أحدث ← (فرق)
اذهب إلى التنقل اذهب إلى البحث

المحدِّد ‎:lang()‎

الوصف

يختار هذا المحدِّد جميع العناصر التي تشترك بلغة معيَّنة.

jQuery( ":lang(language)" )‎

أُضيف مع الإصدار: 1.9.

language

رمز لغة العناصر المراد تحديدها.

يطابق المحدد ‎:lang()‎ العناصر التي تمتلك قيمة لغة مساوية إلى رمز اللغة المعطى أو القيمة التي تبدأ برمز اللغة المعطى ثم تُتيع بالمحرف "-" مباشرةً. سيطابق مثلًا المحدِّد ‎$("div:lang(en)")‎ العنصر <div lang="en"‎> والعنصر <div lang="en-us"‎> وأي عناصر سليلة لهما، ولكن لن يطابق العنصر <div lang="ar"‎>.

تُحدَّد قيمة اللغة في عناصر HTML باستعمال الخاصية lang وقد تحدَّد أحيانًا من معلومات العناصر meta أو ترويسة HTTP.

نقاشات وتفاصيل أوسع حول هذا الاستخدام تجدها في مواصفة W3C CSS.

أمثلة

تلوين عناصر <div> بألوان مختلفة تبعًا للغتها:

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>lang demo</title>
  <style>
  body {
    background-color: #ccc;
  }
  h3 {
    margin: .25em 0;
  }
  div {
    line-height: 1.5em
  }
  .usa {
    background-color: #f00;
    color: #fff;
  }
  .usa .usa {
    background-color: #fff;
    color: #000;
  }
  .usa .usa .usa {
    background-color: #00f;
    color: #fff;
  }
  .spain {
    background-color: #f00;
    color: #ff0;
  }
  .spain .spain {
    background-color: #ff0;
    color: #f00;
    line-height: 3em;
  }
  .spain .spain .spain {
    background-color: #f00;
    color: #ff0;
    line-height: 1.5em;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<h3>USA</h3>
<div lang="en-us">red
  <div>white
    <div>and blue</div>
  </div>
</div>
<h3>España</h3>
<div lang="es-es">rojo
  <div>amarillo
    <div>y rojo</div>
  </div>
</div>
 
<script>
$( "div:lang(en-us)" ).addClass( "usa" );
$( "div:lang(es-es)" ).addClass( "spain" );
</script>
 
</body>
</html>

مصادر