السلام عليكم ورحمة الله وبركاته
[COLOR="#800000"]اولا نبارك لكم حلول عيد الفطر السعيد اعاده الله علينا باليمن والبركات
هذا هو الدرس الثاني من السلسلة ، للي ماشاف الدرس الاول يدخل هنا[/COLOR]
--
--
--
صفر :- أجزاء المقالة
اولا- تحميل مكتبة [COLOR="#4B0082"]Html Agility Pack وهي مكتبة مفتوحة المصدر
ثانيا- اضافة المكتبة بالشرح المصور
ثالثا- تعريف التحليل
رابعا- مقدمة حول لغة Html
خامسا- استخدامات التحليل
سادسا- الخاتمة[/COLOR]
--
--
--
اولا :- تحميل المكتبة
التحميل :-
هنا
--
بعد التحميل وفك الضغط ، ستجد عدة مجلدات كالاتي :
هذه ملفات المكتبة لكل نسخة فريم وررك
[COLOR="#FF0000"]مثلا : المكتبة net45 تحتوي على ميزات اكثر ولكنها لاتعمل الا بوجود فريم وررك 4.5 ، والبقية ايضا كذلك .
في هذا الدرس راح نستخدم net20 لأنها تعمل على كل نسخ الفريم وررك ماعدا فريم وررك 1.0[/COLOR]
--
--
--
ثانيا :- اضافة المكتبة
[COLOR="#2F4F4F"]رغم ان الكثيرين يعرفون طريقة اضافة المكاتب للمشروع
ولكن لإفادة الجميع قمت بعمل شرح مصور بالترتيب[/COLOR]
--
[COLOR="#000000"]1- في الـ Solution explorer ، حدد Refrences ، ثم اضغط زر يمين واختر Add refrence
2- اختر التبويب Browser وحدد الملف واضغط OK
3- الان المكتبة تمت اضافتها إلى مشروعك [/COLOR]
--
--
--
ثالثا :- تعريف التحليل
التحليل هو[COLOR="#FF0000"] قراءة صفحة الويب وإستخراج اي قيمة منها
سواء كانت نص ، ليبل ، عنوان الصفحة وغيرها ...
يتم هذا التحليل دون الحاجة الى فئة WebBrowser
بل يتم بواسطة HtmlAgilityPack وهي صنعت خصيصا لذلك
في الجزء القادم إن شاء الله راح يتم شرح كيفية استخراج البيانات من صفحة ويب[/COLOR]
--
--
--
رابعا :- مقدمة عن لغة Html
ماهي الNode ؟؟
-الـNode بالعربي يعني عقدة ، وصفحات الويب تتكون من Node
الNode او لنقل العقدة لتسهيل الامر لها نوعين
إما نوع عنصر(Element) - أو نوع وسم(Tag)
للمزيد ادخل هنا
[COLOR="#8B4513"]اعلم ان بعضكم قد يقول هذا الكاتب مطول الموضوع ليش مايخش في الشرح مباشرة
ولكن اذا كنت تريد ان تكون محترفا في التحليل فعليك أن تعرف ماذا تفعل
فحن في النهاية نتعامل مع صفحات Html ولازم تكون عندنا دراية ولو بسيطة بهذه اللغة[/COLOR]
--
[COLOR="#800080"]الـ Node قد يكون له ابن(Child) أو والد (Parent) . او الاثنين مها
فمثلا الNode الرئيسي لصفحة الHtml والمسمى <html>
له أبناء مثل ، HEAD,BODY,TITLE
ولكن ليس له والد فهو الرئيسي ، ويوجد العكس
<< نسمي هذا النوع من الNode بـ Tag Node ، اي عقد الوسوم
الوسوم مثل <b> , <Body> , <span> , </input> وغيرها ...
[/COLOR]
[COLOR="#0000CD"]اما الـNode من نوع Element (عنصر) تكون مثلا هكذا
الكود فوق يقوم بإضافة textbox للصفحة
وهذا مايسمى بالعناصر[/COLOR]
نكتفي هنا ولنذهب مباشرة للتطبيق
--
--
--
خامسا :- استخدام التحليل
[COLOR="#8B4513"]وصلنا للجزء المهم من المقالة ، وهو كيفية التحليل
نحدد هدفنا اولا ! ، ما الذي نريد ان نقوم بفعله
ماذا نريد ان نستخرج من صفحة الويب .
بدايا ، نريد أن نستخرج Ip الشبكة من خلال موقع[/COLOR]
http://whatismyipaddress.com/
--
فالنبدأ :
بعد الدخول للموقع ، ابحث عن الIP الخاص بك
بعد العثور عليه قم بوضع الماوس على نص الIP
واضغط زر يمين واختر Inspect Element
كما ترى تم تحديد الـ Parent node لل نص
الان نقوم بكتابة البرنامج
--
نقوم بتصميم زر
وندخل على حدث الclick تبعه ونكتب التالي:
بعد الضغط على الزر راح يتم عرض رسالة فيها الايبي
--
شرح الاكواد :-
[COLOR="#0000FF"]قمت بتعريف كائن hWeb
ثم قمت بتعريف كائن doc يحتوي على الصفحة التي قمت بجلبها من خلال
hWeb[/COLOR]
--
[COLOR="#0000FF"]جلب جميع الNodes التي تحتوي على tag ب span في بدايتها
لاحظ يجب عليك كتابة // قبل اسم الtag [/COLOR]
.. صورة للتوضيح :
--
الدوران على كل العقد التي تم جلبها
--
اذا وجد عقدة بها المواصفة class ، وكانت قيمة المواصفة تساوي[COLOR="#FF0000"] ip blue[/COLOR]
قم
node.InnerText لجلب النص الموجود داخل الnode الحالي
-- لتوضيح المواصفة :
--
--
طريقة اخرى اسهل --
انتهينا من طريق جلب نص من الموقع
--
--
الان منجلب نص موجود داخل عنصر ، وليكن مثلا (textbox)
سنعيد التطبيق على نفس الموقع على هذا التيكست بوكس :
فسيكون المثال كالتالي
بسيط صح
--
--
[COLOR="#000000"]الان نريد أن نجلب قيمة من موقع اسعار الذهب
http://egypt.gold-price-today.com/
عشان تثبت المعلومة عندنا.
نريد ان نجلب قيمة (سعر عيار الذهب عيار 24) بالجنيه المصري وفي محلات الذهب وبالدولار
[img]http://vb4arb.com/vb/uploaded/454_01375955028.png"> [/img]
نقوم بذلك كالاتي :
--
شرح الاكواد :
تحديد جميع الNodes الي يبدأ الtag تبعها ب tr
--
كما تلاحظ وضعت نقطة في مسار الnode
وتعني : حدد الnodes الذي يحتوي على تاغ th ضمن الparent node فقط
اي ضمن tr
--
الشي المهم هو ده
وتعني جلب الNode الاول الذي يحتوي على تاغ td
--للتوضيح
--
--
طريقة اخرى اكثر دقة
وهي باستعمال الxpath
قم بتحديد الparent node ثم قم بنسخ الxpath
--صورة للتوضيح
وقم بلصقه [/COLOR]
--
--
--
سادسا :- الخاتمة
[COLOR="#800000"]الحمدلله وصلنا لنهاية المقالة
اتمنى انكم استفدتون مني ولو كلمة واحدة
ولو اني حاولت تبسيط الموضوع لأقصى درجة بواسطة الصور
وعيدكم مبارك وعساكم من عوادة [/COLOR]
+
الامثلة في المرفقات
+
المزيد
---
---
---
تحياتي
[COLOR="#800000"]اولا نبارك لكم حلول عيد الفطر السعيد اعاده الله علينا باليمن والبركات
هذا هو الدرس الثاني من السلسلة ، للي ماشاف الدرس الاول يدخل هنا[/COLOR]
--
--
--
صفر :- أجزاء المقالة
اولا- تحميل مكتبة [COLOR="#4B0082"]Html Agility Pack وهي مكتبة مفتوحة المصدر
ثانيا- اضافة المكتبة بالشرح المصور
ثالثا- تعريف التحليل
رابعا- مقدمة حول لغة Html
خامسا- استخدامات التحليل
سادسا- الخاتمة[/COLOR]
--
--
--
اولا :- تحميل المكتبة
التحميل :-
هنا
--
بعد التحميل وفك الضغط ، ستجد عدة مجلدات كالاتي :
هذه ملفات المكتبة لكل نسخة فريم وررك
[COLOR="#FF0000"]مثلا : المكتبة net45 تحتوي على ميزات اكثر ولكنها لاتعمل الا بوجود فريم وررك 4.5 ، والبقية ايضا كذلك .
في هذا الدرس راح نستخدم net20 لأنها تعمل على كل نسخ الفريم وررك ماعدا فريم وررك 1.0[/COLOR]
--
--
--
ثانيا :- اضافة المكتبة
[COLOR="#2F4F4F"]رغم ان الكثيرين يعرفون طريقة اضافة المكاتب للمشروع
ولكن لإفادة الجميع قمت بعمل شرح مصور بالترتيب[/COLOR]
--
[COLOR="#000000"]1- في الـ Solution explorer ، حدد Refrences ، ثم اضغط زر يمين واختر Add refrence
2- اختر التبويب Browser وحدد الملف واضغط OK
3- الان المكتبة تمت اضافتها إلى مشروعك [/COLOR]
--
--
--
ثالثا :- تعريف التحليل
التحليل هو[COLOR="#FF0000"] قراءة صفحة الويب وإستخراج اي قيمة منها
سواء كانت نص ، ليبل ، عنوان الصفحة وغيرها ...
يتم هذا التحليل دون الحاجة الى فئة WebBrowser
بل يتم بواسطة HtmlAgilityPack وهي صنعت خصيصا لذلك
في الجزء القادم إن شاء الله راح يتم شرح كيفية استخراج البيانات من صفحة ويب[/COLOR]
--
--
--
رابعا :- مقدمة عن لغة Html
ماهي الNode ؟؟
-الـNode بالعربي يعني عقدة ، وصفحات الويب تتكون من Node
الNode او لنقل العقدة لتسهيل الامر لها نوعين
إما نوع عنصر(Element) - أو نوع وسم(Tag)
للمزيد ادخل هنا
[COLOR="#8B4513"]اعلم ان بعضكم قد يقول هذا الكاتب مطول الموضوع ليش مايخش في الشرح مباشرة
ولكن اذا كنت تريد ان تكون محترفا في التحليل فعليك أن تعرف ماذا تفعل
فحن في النهاية نتعامل مع صفحات Html ولازم تكون عندنا دراية ولو بسيطة بهذه اللغة[/COLOR]
--
[COLOR="#800080"]الـ Node قد يكون له ابن(Child) أو والد (Parent) . او الاثنين مها
فمثلا الNode الرئيسي لصفحة الHtml والمسمى <html>
له أبناء مثل ، HEAD,BODY,TITLE
ولكن ليس له والد فهو الرئيسي ، ويوجد العكس
<< نسمي هذا النوع من الNode بـ Tag Node ، اي عقد الوسوم
الوسوم مثل <b> , <Body> , <span> , </input> وغيرها ...
[/COLOR]
[COLOR="#0000CD"]اما الـNode من نوع Element (عنصر) تكون مثلا هكذا
PHP كود :
<input class="gsfi" id="lst-ib" name="q" maxlength="2048" title="بحث" size="41" type="text" autocomplete="off" dir="rtl" spellcheck="false">
الكود فوق يقوم بإضافة textbox للصفحة
وهذا مايسمى بالعناصر[/COLOR]
نكتفي هنا ولنذهب مباشرة للتطبيق
--
--
--
خامسا :- استخدام التحليل
[COLOR="#8B4513"]وصلنا للجزء المهم من المقالة ، وهو كيفية التحليل
نحدد هدفنا اولا ! ، ما الذي نريد ان نقوم بفعله
ماذا نريد ان نستخرج من صفحة الويب .
بدايا ، نريد أن نستخرج Ip الشبكة من خلال موقع[/COLOR]
http://whatismyipaddress.com/
--
فالنبدأ :
بعد الدخول للموقع ، ابحث عن الIP الخاص بك
بعد العثور عليه قم بوضع الماوس على نص الIP
واضغط زر يمين واختر Inspect Element
كما ترى تم تحديد الـ Parent node لل نص
الان نقوم بكتابة البرنامج
--
نقوم بتصميم زر
وندخل على حدث الclick تبعه ونكتب التالي:
PHP كود :
string url = "http://whatismyipaddress.com";
HtmlAgilityPack.HtmlWeb hWeb = new HtmlAgilityPack.HtmlWeb();
HtmlAgilityPack.HtmlDocument doc = hWeb.Load(url, "GET");
HtmlAgilityPack.HtmlNodeCollection nodes = doc.DocumentNode.SelectNodes("//span");
foreach (HtmlAgilityPack.HtmlNode node in nodes)
{
if (node.GetAttributeValue("class", "") == "ip blue")
{
MessageBox.Show(node.InnerText);
}
}
بعد الضغط على الزر راح يتم عرض رسالة فيها الايبي
--
شرح الاكواد :-
PHP كود :
string url = "http://whatismyipaddress.com";
HtmlAgilityPack.HtmlWeb hWeb = new HtmlAgilityPack.HtmlWeb();
HtmlAgilityPack.HtmlDocument doc = hWeb.Load(url, "GET");
[COLOR="#0000FF"]قمت بتعريف كائن hWeb
ثم قمت بتعريف كائن doc يحتوي على الصفحة التي قمت بجلبها من خلال
hWeb[/COLOR]
--
PHP كود :
HtmlAgilityPack.HtmlNodeCollection nodes = doc.DocumentNode.SelectNodes("//span");
[COLOR="#0000FF"]جلب جميع الNodes التي تحتوي على tag ب span في بدايتها
لاحظ يجب عليك كتابة // قبل اسم الtag [/COLOR]
.. صورة للتوضيح :
--
PHP كود :
foreach (HtmlAgilityPack.HtmlNode node in nodes)
الدوران على كل العقد التي تم جلبها
--
PHP كود :
if (node.GetAttributeValue("class", "") == "ip blue")
اذا وجد عقدة بها المواصفة class ، وكانت قيمة المواصفة تساوي[COLOR="#FF0000"] ip blue[/COLOR]
قم
PHP كود :
MessageBox.Show(node.InnerText);
node.InnerText لجلب النص الموجود داخل الnode الحالي
-- لتوضيح المواصفة :
--
--
طريقة اخرى اسهل --
PHP كود :
string url = "http://whatismyipaddress.com";
HtmlAgilityPack.HtmlWeb hWeb = new HtmlAgilityPack.HtmlWeb();
HtmlAgilityPack.HtmlDocument doc = hWeb.Load(url, "GET");
HtmlAgilityPack.HtmlNode node = doc.DocumentNode.SelectNodes("//span[@class='ip blue']")[0];
MessageBox.Show(node.InnerText);
انتهينا من طريق جلب نص من الموقع
--
--
الان منجلب نص موجود داخل عنصر ، وليكن مثلا (textbox)
سنعيد التطبيق على نفس الموقع على هذا التيكست بوكس :
فسيكون المثال كالتالي
PHP كود :
string url = "http://whatismyipaddress.com";
HtmlAgilityPack.HtmlWeb hWeb = new HtmlAgilityPack.HtmlWeb();
HtmlAgilityPack.HtmlDocument doc = hWeb.Load(url, "GET");
HtmlAgilityPack.HtmlNode node = doc.DocumentNode.SelectNodes("//input[@name='LOOKUPADDRESS']")[0];
MessageBox.Show(node.InnerText);
بسيط صح
--
--
[COLOR="#000000"]الان نريد أن نجلب قيمة من موقع اسعار الذهب
http://egypt.gold-price-today.com/
عشان تثبت المعلومة عندنا.
نريد ان نجلب قيمة (سعر عيار الذهب عيار 24) بالجنيه المصري وفي محلات الذهب وبالدولار
[img]http://vb4arb.com/vb/uploaded/454_01375955028.png"> [/img]
نقوم بذلك كالاتي :
PHP كود :
string url = "http://egypt.gold-price-today.com/";
HtmlAgilityPack.HtmlWeb hWeb = new HtmlAgilityPack.HtmlWeb();
HtmlAgilityPack.HtmlDocument doc = hWeb.Load(url, "GET");
HtmlAgilityPack.HtmlNodeCollection nodes = doc.DocumentNode.SelectNodes("//tr"); //parent node
foreach (HtmlAgilityPack.HtmlNode node in nodes)
{
if (node.SelectNodes(".//th")[0].InnerText == "سعر الذهب عيار 24")
{
MessageBox.Show("سعر الذهب بالجنيه المصري" + "\n" + node.SelectNodes(".//td")[0].InnerText);
MessageBox.Show("سعر الذهب في محلات الذهب" + "\n" + node.SelectNodes(".//td")[1].InnerText);
MessageBox.Show("سعر الذهب بالدولار" + "\n" + node.SelectNodes(".//td")[2].InnerText);
return;
}
}
--
شرح الاكواد :
PHP كود :
HtmlAgilityPack.HtmlNodeCollection nodes = doc.DocumentNode.SelectNodes("//tr"); //parent node
تحديد جميع الNodes الي يبدأ الtag تبعها ب tr
--
كود :
node.SelectNodes("[color=#FF0000].[/color]//th")[0].InnerText == "سعر الذهب عيار 24"
كما تلاحظ وضعت نقطة في مسار الnode
وتعني : حدد الnodes الذي يحتوي على تاغ th ضمن الparent node فقط
اي ضمن tr
--
PHP كود :
MessageBox.Show("سعر الذهب بالجنيه المصري" + "\n" + node.SelectNodes("./
/td")[0].InnerText);
MessageBox.Show("سعر الذهب في محلات الذهب" + "\n" + node.SelectNodes(".//td")[1].InnerText);
MessageBox.Show("سعر الذهب بالدولار" + "\n" + node.SelectNodes(".//td")[2].InnerText);
الشي المهم هو ده
PHP كود :
node.SelectNodes(".//td")[0].InnerText
وتعني جلب الNode الاول الذي يحتوي على تاغ td
--للتوضيح
--
--
طريقة اخرى اكثر دقة
وهي باستعمال الxpath
قم بتحديد الparent node ثم قم بنسخ الxpath
--صورة للتوضيح
وقم بلصقه [/COLOR]
كود :
HtmlAgilityPack.HtmlNodeCollection nodes = doc.DocumentNode.SelectNodes("[color=#FF0000]//*[@id='right']/table[1]/tbody/tr[1][/color]");
--
--
--
سادسا :- الخاتمة
[COLOR="#800000"]الحمدلله وصلنا لنهاية المقالة
اتمنى انكم استفدتون مني ولو كلمة واحدة
ولو اني حاولت تبسيط الموضوع لأقصى درجة بواسطة الصور
وعيدكم مبارك وعساكم من عوادة [/COLOR]
+
الامثلة في المرفقات
+
المزيد
---
---
---
تحياتي