تحتاج إلى مكتبة جافا سكريبت أو jquery لتحويل xpath إلى تنسيق CSS3 القابل للتحديد في jquery

StackOverflow https://stackoverflow.com/questions/1652759

  •  22-07-2019
  •  | 
  •  

سؤال

كيف يمكنني تحويل xpath مثل

/html/body/div[3]/ul/li[1]/a[5]

html > body > div[3] > ul > li[1] > a[5]

أعتقد أن الفهرس غير مدعوم بمحددات CSS3.... فكيف نتعامل مع هذا؟

هل كانت مفيدة؟

المحلول

إذا وجدت أن Sizzle/jQuery لا يمكنه تطبيق محدد CSS3 الخاص بك، فقد يكون من الأفضل استخدام البرنامج المساعد XPath والذي كان جزءًا من الإصدار الأصلي لـ jQuery (ثم تمت إزالته نظرًا لأن عددًا قليلًا من الأشخاص استخدموه بالفعل).

تميل تطبيقات XPath في المتصفحات إلى أن تكون كثيرة أسرع من محركات CSS.سيكون أيضًا الحصول على تحليل JS وتحويل تعبير XPath إلى CSS3 ثم تحويل jQuery لذلك إلى شيء يمكن للمتصفح تنفيذه (عمومًا محددات CSS2.1 مع قليل من مساعدة JS) سيكون كذلك كثيراً أبطأ من تنفيذ XPath مباشرة في المتصفح.

ليس هذا فحسب، بل هناك أشياء يمكن لـ XPath القيام بها ولا يستطيع CSS القيام بها.على سبيل المثال:
//h3[class="blog-title"]/../../div[class="blog-entry"]//input[fn:floor(value) > 3]
وهو أمر ليس معقدًا للغاية بالنسبة لـ XPath لتنفيذه، ولكنه مستحيل بالنسبة لـ CSS وحده - لا يمكن إجراء النسخ الاحتياطي لـ DOM وتنفيذ وظيفة كجزء من التعبير حتى الآن (على حد علمي)، حتى في CSS3.

نصائح أخرى

ونقل المحرك CSS محدد السيلينيوم 1 من CSSQuery إلى همسة، مكتبة CSS محدد مسج ل. حتى تتمكن من تحويل

div[3]/ul/li[1]/a[5] 

إلى

css=div:nth(3)>ul>li:nth(1)>a:nth(5)

و

//h3[class="blog-title"]/../../div[class="blog-entry"]//input[@value=3] 

ويمكن تحويلها إلى

css=h3.blog-title:parent(div.blog-entry) input[value=3]

ولكن //input[@value>3] لا يمكن أن يكون ممكنا أو أن تكون خادعة لمزيد من المعلومات زيارة: https://github.com/jquery/sizzle/wiki/Sizzle- الصفحة الرئيسية

وتنفيذ XPath في IE جدا، بطيئة جدا. حتى مرعبة بطيئة في IE6 الذي يكون السبب في أن معظم تميل إلى استخدام محددات CSS على أساس رجإكس الخ مثل همسة أو أحدث غير QWERY. لمؤشر تحديد تستخدمها في CSS و:nth-child(n) محدد

a[5] = :nth-child(5)

وأنا غير قادر على تذكر ما اذا كان يبدأ ب 0 أو 1 لذلك يمكن أيضا أن يكون 4.

وأيضا إذا كان لديك أنواع مختلفة من الأطفال داخل الوالد الذي يتم تحديده في، يمكنك استخدام :nth-of-type() الذي يختار فقط نوع معين. في الحالة الخاصة بك:

a:nth-of-type(5)

لقد بحثت كثيرًا وأخيراً وجدت هاتين المكتبتين.آمل أن يساعد شخص ضائع مثلي:

  1. جيمس بادولسي CSS2XPATH تم استخدامه بواسطة YQL HTML في وقت واحد
  2. css2xpath - محول CSS عام إلى XPath

نظرًا لأن هذا مجال متخصص تمامًا، فإنني أرحب بالمجتمع لإجراء تعديلات عليه.

مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top