الفرق بين المراجعتين لصفحة: «jQuery/next adjacent selector»

من موسوعة حسوب
إضافة محتويات الصفحة.
 
لا ملخص تعديل
 
(مراجعة متوسطة واحدة بواسطة مستخدم واحد آخر غير معروضة)
سطر 1: سطر 1:
<noinclude>{{DISPLAYTITLE:المحدد <code>("prev + next")</code>‎ في jQuery}}</noinclude>
<noinclude>{{DISPLAYTITLE:محدد العناصر الأخوة المتجاورة <code>‎‎("prev + next")</code>‎ في jQuery}}</noinclude>
== محدد العناصر الأخوة المتجاورة next adjacent selector ==
== محدد العناصر الأخوة المتجاورة next adjacent selector ==


سطر 52: سطر 52:


== مصادر ==
== مصادر ==
* [http://api.jquery.com/next-adjacent-selector/ صفحة المحدِّد next adjacent في توثيق jQuery الرسمي.]
* [http://api.jquery.com/next-adjacent-selector/ صفحة المحدِّد next adjacent في توثيق jQuery الرسمي.]
[[تصنيف:jQuery]]
[[تصنيف:jQuery]]
[[تصنيف:jQuery Selectors]]
[[تصنيف:jQuery Selectors]]

المراجعة الحالية بتاريخ 07:58، 6 يونيو 2018

محدد العناصر الأخوة المتجاورة next adjacent selector

الوصف

يختار هذا المحدِّد جميع العناصر التالية التي تطابق "next"، ويسبقها العناصر الأخوة "prev" مباشرةً.

jQuery( "prev + next" )‎

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

prev

أي محدَّد صحيح.

next

محدِّد لمطابقة العنصر الذي يلي العنصر المعطى في المحدِّد الأول prev.

هنالك أمرٌ يجب لفت انتباهك له وهو أنَّ العناصر على كلا جانبي المحدِّدين وهما محدِّد العناصر الأخوة المتجاورة prev + next ومحدِّد العناصر الأخوة prev ~ siblings يجب أن تشترك مع العنصر الأب ذاته.

أمثلة

إيجاد جميع العناصر <input> المدخلة التي بجوار العنصر <label>:

<!doctype html>
<html lang="ar">
<head>
  <meta charset="utf-8">
  <title>مثالٌ عن محدد العناصر الأخوة المتجاور</title>
  <style>
  div, span, p {
    width: 126px;
    height: 60px;
    float: left;
    padding: 3px;
    margin: 2px;
    background-color: #eee;
    font-size: 14px;
  }
  </style>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
 
<div>عنصر div</div>
<p class="myClass">فقرة من الصنف class="myClass"</p>
<p class="notMyClass">فقرة من الصنف class="notMyClass"</p>
<span>عنصر span</span>
 
<script>
$( "div, span, p.myClass" ).css( "border", "3px solid red" );
</script>
 
</body>
</html>

مصادر