اذهب إلى المحتوى

عزيز

الأعضاء
  • المساهمات

    81
  • تاريخ الانضمام

  • تاريخ آخر زيارة

كل منشورات العضو عزيز

  1. يمكن إظهار function من خلال استدعائه.يمكنك استدعائه في أي مكان في الصفحة.يمكنك إستخدامه عن طريق الشيفرة البرمجية التالية:function functionName() { code to be executed; }ضع إسم مناسب للشيفرة الوظيفية بحيث يشرح عملها.يمكنك أن تبدأ اسم الشيفرة بأحرف أو اشارة _ ولكن ليس برقم.مثال: <html> <body> <?php function writeName() { echo "أكادميّة حسوب"; } echo " مرحباً بكم في قسم الأسئلة و الأجوبة"; writeName(); ?> </body> </html>
  2. إن تعبير "SVG" هو إختصار لرسومات "فيكتور" متغيرة الحجم .تستخدم "SVG" لتعريف الصور من نوع فيكور (عكس بيت ماب "bitmap") المستخدمة في الويب. يمكن إنشاء و تعديل صور "SVG" من خلال برنامج محرر نصوص.يمكنك مثلًا رسم نجمة خماسية عن طريق الشّيفرة التالية:<!DOCTYPE html> <html> <body> <svg xmlns="http://www.w3.org/2000/svg" version="1.1" height="190"> <polygon points="100,10 40,180 190,60 10,60 160,180" style="fill:red;stroke:orange;stroke-width:5;fill-rule:evenodd;" /> </svg> </body> </html> و رسم شكل سداسي عن طريق الشيفرة التالية:<svg width="300" height="350"> <g> <polygon points="150,75 258,137.5 258,262.5 150,325 42,262.6 42,137.5" stroke="black" stroke-width="3" fill="rgb(121,0,121)"> </g> </svg>
  3. يمكن إدراج البيانات بإستخدام التعليمة البرمجية "INSERT INTO" وذلك بطريقتين: لا تحدد الطريفة الأولى أسماء الأعمدة حيث سيتم إدراج البيانات فقط قيمهم: INSERT INTO table_name VALUES (value1, value2, value3,...)يحدد الشكل الثاني كلاً من أسماء الأعمدة وقيمهم التي سيتم إدراجها: INSERT INTO table_name (column1, column2, column3,...) VALUES (value1, value2, value3,...)
  4. تواجه هذه المشكلة الكثير من القائمين على إدارة المواقع العاملة على منصّة "ووردبريس" عند تثبيت الكثير من الإضافات الجديدة. لحل المشكلة عليك إستبدال السطور البرمجية المضمًنة ضمن ملف التنسيق الخاص بموقعك "Style.Css" و التي تكون ضمن تركيبة"mainFrontContents": #mainFrontContents #latestPosts { overflow: hidden; width: 530px; }إستبدلها بالشيفرة التالية: #mainFrontContents #latestPosts { overflow: hidden; width: 530px; height: 100%; margin-top: auto; padding-top: 400px; }
  5. قم بتحديد "عرض الحاوية" التي تحوي عناصر الموقع ضمنها بعرض مناسب لشاشات الهاتف. فمثلاً لو كانت قيم أبعاد الحاوية كما في الشيفرة التالية: #header{ width: 1000px; } #header .logo{ font-size: 18px; } إستبدلها بالشيفرة التالية: @media (max-width: 800px) { #header{ width: 700px; } #header .logo{ font-size: 14px; }يعد إستخدام الشيفرة السابقة سيتناسب حجم العناصر مع عرض الشاشة، فعندما تقوم بفتح الموقع على شاشة مقاسها 800 بيكسل، سيتم تصغير العناصر وإلغاء المساحات الفارغة.
  6. الحلقة عبارة عن شيفرة "PHP" تستخدم لعرض المقالات في ووردبرس و تستخدم أيضاً في القوالب لعرض قائمة من المقالات. مثال للحلقة الأساسية في "ووردبرس": <?php if ( have_posts() ) : ?> <?php /* Start the Loop */ ?> <?php while ( have_posts() ) : the_post(); ?> <h2 class="entry-title"><a href="<?php the_permalink(); ?>" rel="bookmark"> <?php the_title(); ?></a></h2> <div class="entry-meta"> <?php thw_date(); ?> </div><!-- .entry-meta --> <div class="entry-summary"> <?php the_excerpt(); ?> </div><!-- .entry-summary --> <?php endwhile; endif; ?> 1 2 3 4 5 6 7 8 9 10 11 12 <?php if ( have_posts() ) : ?> <?php /* Start the Loop */ ?> <?php while ( have_posts() ) : the_post(); ?> <h2 class="entry-title"><a href="<?php the_permalink(); ?>" rel="bookmark"> <?php the_title(); ?></a></h2> <div class="entry-meta"> <?php thw_date(); ?> </div><!-- .entry-meta --> <div class="entry-summary"> <?php the_excerpt(); ?> </div><!-- .entry-summary --> <?php endwhile; endif; ?>في الشيفرة السابقة إستخدمنا التعليمة "have_post" للتأكد من وجود مقالات وفي حالة تحقق ذلك سينفذ الشيفرة الى يلي تعليمة الـ"if" إلى أن يصل الى التعليمة "endif".
  7. تستخدم "PHPIDS" لحماية "سكريبتات PHP" من الثغرات التي يقع فيها المبرمجين مثل "Remote/Local file include , XSS , SQL Injection""PHP-IDS" هو اختصار لـ "PHP-Intrusion Detection System"لإستخدامه عليك تحميله من الرابط التالي:http://php-ids.org/files/phpids-0.6.1.1.tar.gzبعد تثبيت البرنامج ستجد الملفين "default_filter.json" و "default_filter.xml" اللذين يحتويان على القواعد التي يتحقق منها "PHPIDS".بعد ذلك قم بتنفيذ السطر البرمجي التالي على السيفر بإستخدام صفحة "Linux Shell" :chown -R apache:apache /var/www/phpids-0.6.1.1/lib/IDS/tmpلقد أتممت العمليّة بنجاح ، عليك زيارة الرابط التالي لإستعراض سجلات محاولات إستغلات ثغرات موقعك: http://YoursiteDomain/php-ids.phpستكون الصفحة بيضاء فارغة في بداية الأمر على أمل أن تبقى بيضاء دائماً.
  8. حدد العنصر الذي تريد تثبته و الذي غالباً يكون "DIV" و ذلك حسب السطر التالي: <div id="somthing_sticky">Fixed DIV</div>بعد ذلك قم بإضافة وسوم "CSS" عليه كالسّطر البرمجي التالي: #somthing_sticky { top:100px; right:30px; position:fixed; }من استخدامات هذه الميزة تثبيت سطر تسجيل الدخول في المنتديات و تثبيت زر الصعود لأعلى الصفحة و تثبيت القائمة الرئيسية للموقع كما تراه في أعلى صفحة موقع "أكادميّة حسوب".
  9. هذه الحلقة تختلف عن الحلقات الأخرى فهي تعتمد على "المصفوفات" ويمكن إستخدامها عندما نحتاج جلب بيانات من قاعدة البيانات و تخزينها في مصفوفة ليتم عرضها بطريقة حلقية ضمن الـ "foreach". مثال: <? $i = array("sat","sun","mon"); foreach ($i as $value) { echo $value . "<br />"; } ?> النتيجة ستكون: sat sun mon
  10. يمكنك كتابة ملاحظات على نفس الشيفرة البرمجية باستخدام العلامات "//" - "/*" - "/*" كما في الشيفرة التالية: <?php $num1 = 600; // الرقم الأول $num2 = 200; // الرقم الثاني /* الشيفرة التالية تقوم بعملية حسابية وهذه الملاحظة يمكن كتابتها في أكثر من سطر سطرين ثلاثة وأربعة وحتى يتم إغلاقها */ echo ( $num1 + $num2 ); // الناتج 800 ?>كل ما تمّ كتابته ضمن الشيفرة باللون البني الغامق لن يتم تنفيذه فهو عبارة عن ملاحظات فقط.
  11. بداية يجب عليك أن تعمل على نظام تشغيل تعمل عليه "مترجمات لغة PHP" و هي تعمل على "Linux,Mac,Windows".يمكنك تنصيب برنامج تحرير لصفحات الـ"PHP" و الذي بإمكانه عرض شكل مقرّب لتنفيذ شيفرة الصفحة كبرنامج "Adobe Dreamwaver" مع العلم أن هذا البرنامج باهظ الثمن. الخيار الأفضل هو القيام بتنزيل برنامج "ويب سيرفر" كبرنامج الـ"Apache" المفتوح المصدر وذلك لأن نتيجة محاكاته لتنفيذ شيفرات "PHP" تكون مطابقة لما يتم تنفيذه على سيرفر الموقع الأساسي.في حال كان موقعك مرتبط بقاعدة بيانات "MySQL" عندها ستحتاج لبرنامج "PHPmyAdmin" و ربطه مع برنامج السيرفر المحلّي.
  12. باستخدام "CSS" يمكن أن تطفو العناصر إلى اليمين أو إلى اليسار و تبقى باقي العناصر حولهم.تستخدم هذه الخاصيّة عادةّ مع الصور ولكن تستخدم أيضاً مع هيكل تصميم الموقع.تطفو العناصر "Float" أفقيّاً و لكن لا يمكن أن تطفو للأعلى و الأسفل.لن تتأثر العناصر الواقعة قبل العناصر الطافية.إذا تم "طفو صورة إلى اليمين" فإن النص سيلتف حولها من جهة اليسار.
  13. خصائص منتقى العناصر "Element Selector": $("p") : تستخدم لاختيار جميع عناصر <p>.$("p.intro") : تستخدم لإختيار جميع عناصر <p> و التي تحتوي على "class"="intro".$("p#demo") : تستخدم لاختيار جميع عناصر <p> و التي تحتوي على "id"="intro".خصائص منتقى اللواحق "Attribute Selectors": $("[href]") : تستخدم لإختيار العناصر التي تحتوي على اللاحقة "href".$("[href='#']") : تستخدم لإختيار العناصر التي تحتوي على القيمة “#” المرفقة مع اللاحقة "href".$("[href!='#']") : تستخدم لإختيار العناصر التي لا تحتوي على القيمة “#” المرفقة مع اللاحقة "href".$("[href$='.jpg']") : تستخدم لإختيار العناصر التي تحتوي على اللاحقة "href" والتي تنتهي قيمتها بـ"jpg".
  14. يمكنك فعل ذلك بإستخدام الخاصية "opacity" على الصور بإستخدام الشيفرة البرمجية التالية: img { opacity:0.4; filter:alpha(opacity=40); }القيمة تكون بين الـ(0 و 1) و"كلما انخفضت القيمة كلما كانت الشفافية أكبر". كما يمكن إضافة السطر البرمجي التالي لتطبيق الشفافية فقط عند تمرير المؤشر فوق الصورة: filter:alpha(opacity=100)
  15. يمكنك تطبيق ذلك عن طريق تطبيق الشيفرة البرمجيّة التالية: p:first-line { color:#ff0000; font-variant:small-caps; }قمنا عن طريق الشيفرة السابقة تحديد لون السطر الأول و حجم خط الكلمات الموجودة ضمنه. يمكن للواصفات التالية استخدام التأثير "first-line": خاصية نوع الخط "font"خاصية اللون "color"خاصية الخلفية "background"تباعد الكلمات "word-spacing"تباعد الأحرف "letter-spacing"تصميم النص "text-decoration"المحاذاة الأفقية "vertical-align"تحويل النص "text-transform"إرتفاع السطر "line-height"المسح "clear"
  16. يمكنك ترتيب العناصر عن طريق خاصيات "اليمين right" و"اليسار left" و"الأعلى top" و"الأسفل bottom". هناك أربع أنماط للترتيب: الترتيب الجامد "Static" وهو ترتيب عادي يعتمد على شكل الصفحة إعتماداً على تعليمات "HTML".الترتيب المثبت "Fixed" و ترتيب للعناصر ثابت لا يتغير إلا إذا تغير مقاس صفحة المتصفّح.الترتيب المتصل "Relative" فيه سيكون محتوى "العنصر المتصل" قادر على أن ينتقل أو يتداخل مع العناصر الأخرى.الترتيب المطلق "Absolute" يتم إزالة "العناصر المثبتة" بشكل مطلق من الشكل الطبيعي حيث ستصبح الصّفحة والعناصر الرئيسية كما لو أن العناصر المطلقة غير موجودة.
  17. يمكنك الرسم باستخدام الوسم "Canvas" لرسم الخطوط و الدوائر و التداخل بينها ، لا تدعم هذه الميزات إلا الإصدارات الأخيرة من متصفّحات الإنترنت الصّادرة ضمن الربع الثاني من عام 2015 و ما بعد ، فيمكنك تضمين شيفرة رسم خط أو رسم دائرة ضمن وسم "Script" في موقعك و ذلك كما يلي: شيفرة رسم خط:</script> <canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;"> في السطر البرمجي السابق يتم تحديد عرض الخط و لونه </canvas> <script type="text/javascript"> var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.moveTo(10,10); ctx.lineTo(150,50); ctx.lineTo(10,50); ctx.stroke(); </script>شيفرة رسم دائرة:<script> <canvas id="myCanvas" width="200" height="100" style="border:1px solid #c3c3c3;"> في السطر البرمجي السابق تم تحديد عرض الخط المستخدم برسم الدائرة و لونه و أبعاد المستطيل الذي رسمت داخله الدائرة </canvas> <script type="text/javascript"> var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.fillStyle="#FF0000"; ctx.beginPath(); ctx.arc(70,18,15,0,Math.PI*2,true); ctx.closePath(); ctx.fill(); </script>
  18. أحداث تمرير المؤشر تنفّذ على جميع العناصر و الوسوم عدا: bdo, br, frame, frameset, head, html, iframe, meta, param, script, style, titleحالات إستخدام تقنيات "جافاسكربت" مع أحداث المؤشر: "onclick": تستخدم "السكربت" عند الضغط بالفأرة."ondblclick": تستخدم "السكربت" عند النقر بالفأرة مرتين."onmousedown": تستخدم "السكربت" عند الضغط على زر الفأرة."onmousemove": تستخدم "السكربت" عند تحريك مؤشر الفأرة على العنصر."onmouseout": تستخدم "السكربت" عند إزالة المؤشر من العنصر."onmouseover": تستخدم "السكربت" عند تمرير الفأرة فوق العنصر."onmouseup": تستخدم "السكربت" عند تحرير زر الفأرة.
  19. يمكنك إستخدام الشيفرة البرمجيّة التالية: var txt = '{ "employees" : [' + '{ "firstName":"john" , "lastName":"Smith" },' + '{ "firstName":"Louis" , "lastName":"Armstrong" },' + '{ "firstName":"Lionardo" , "lastName":"Vivaldi" } ]}';يمكنك استخدام التعليمة "eval" لتحويل النص "JSON" إلى كائن "Javascript".تستخدم التعليمة "eval" لإنشاء كائن "Javascript" عن طريق السطر البرمجي التالي:var obj = eval ("(" + txt + ")");من الآمن استخدام تعليمات "JSON" لتحويل نصوص "JSON" إلى "كائن" جافاسكربت "JavaScript".ستتنفذ شيفرات "JSON" فقط على نصوص "JSON" و لن تنفّذ على باقي شيفرات الموقع.تدعم هذه التقنية جميع المتصفحات التي تدعم "JavaScript" الرسميّة "ECMAScript".
  20. يجب عليك عدم القيام بالأمور التالية: وضع كلمات دليليّة مغايرة لمحتوى الصّفحة لإيهام و إضلال محركات البحث.إعادة توجيه المستخدمين من صفحة مؤرشة إلى أخرى غير مؤرشفة.استخدام نص "مخفي" أو نص من لون الخلفيّة أو تقليل من قياس الخط إلى حد لا يمكن رؤيته.إنشاء فقرات مطابقة لفقرات موجودة في مواقع إنترنت شهيرة. استخدام أكثر من نطاق لعرض محتوى موقع واحد.
  21. يمكنك تحديد لون و نوع الخط و لون الخلفية للروابط في موقعك و ذلك بأربع حالات للرابط: a:link هي مواصفات الرابط العادي الذي لم تتم زيارته من قبل.a:visited هو شكل الرابط الذي تمّت زيارته من الزائر.a:hover وهو شكل الرابط عندما يمرر المستخدم مؤشر "الفأرة" فوق الرابط بدون أن يتم الضغط عليه.a:active وهو شكل الرابط لحظة النقر على الرابط.فيتم تطبيق ألوان على حالات السابقة حسب الشيفرات التالية: a:link {color:#FF0000;} a:visited {color:#00FF00;} a:hover {color:#FF00FF;} a:active {color:#0000FF;}ملاحظة: يجب استخدام "a:hover" بعد a:link and a:visitedيجب استخدام "a:active" بعد a:hoverو لون خلفية الرابط تحدد الخلفية "Background Color": a:link {background-color:#B2FF99;} a:visited {background-color:#FFFF85;} a:hover {background-color:#FF704D;} a:active {background-color:#FF704D;} و تستخدم تعليمة "text-decoration" لإزالة الخط الموجود تحت الرابط التشعبي.
  22. تحتاج أولاً لرابط تغذية "RSS" للموقع المطلوب من أجل إستدعاء المعلومات و عندما يقوم المستخدم بإختيار نوع التغذية من القائمة المنسدلة ستتفعّل التعليمة "showResult" و المرتبطة مع الحدث "onchange" وذلك حسب الشيفرة التالية: <html> <head> <script type="text/javascript"> function showRSS(str) { if (str.length==0) { document.getElementById("rssOutput").innerHTML=""; return; } if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("rssOutput").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","getrss.php?q="+str,true); xmlhttp.send(); } </script> </head> <body><form> <select onchange="showRSS(this.value)"> <option value="">q</option> <option value="Ajax">هنا يتم إستدعاء تغذية عن أجاكس</option> <option value="html">هنا يتم إستدعاء تغذية عن إتش تي إم إل</option> </select> </form> <br /> <div id="rssOutput"></div> </body> </html>ستقوم التعليمة "showResult" بفحص تغذية "RSS" عند إختيارها و تنشئ الكائن "XMLHttpRequest" و عندها سيتم إرسال الطلب إلى المخدّم.
  23. في الشيفرة التالية سيتم إظهار البيانات المخزّنة ضمن قاعدة بينات "MySQL" عندها سيتم استدعاء البيانات المطلوبة المخزنة بواسطة تعليمات "AJAX" و سيتم استدعاء التعليمة "showUser" من خلال الحدث "onchange": <html> <head> <script type="text/javascript"> function showCustomer(str) { var xmlhttp; if (str==”") { document.getElementById(“txtHint”).innerHTML=”"; return; } if (window.XMLHttpRequest) { xmlhttp=new XMLHttpRequest(); } else { xmlhttp=new ActiveXObject(“Microsoft.XMLHTTP”); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById(“txtHint”).innerHTML=xmlhttp.responseText; } } xmlhttp.open(“GET”,”getcustomer.asp?q=”+str,true); xmlhttp.send(); } </script> </head> <body><form> <select name="users" onchange="showUser(this.value)"> <option value="">qq</option> <option value="1">1</option> <option value="2">11</option> <option value="3">111</option> <option value="4">1111</option> </select> </form> <br /> <div id="txtHint"><b> </b></div></body> </html>سيتم إنشاء "Function" واستدعائها عندما تكون استجابة المخدّم جاهزة و سيتم إرسال طلب الى ملف على المخدّم.
  24. عن طريق هذه الشيفرة البرمجية يمكن لصفحة الإنترنت الإتصال بالمخدّم بينما يكتب المستخدم أحرف في مربع البحث ضمن موقع و عندها ستعمل التعليمة "showHint المرتبطة مع الحدث onkeyup" ، وذلك عن طريق الشيفرة التالية: <html> <head> <script type="text/javascript"> function showHint(str) { if (str.length==0) { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) {/هذا الشيفرة للمتصفحات "أوبرا" و "سفاري" و "كروم" و "فايرفوكس" xmlhttp=new XMLHttpRequest(); } else {/ هذه الشيفرة لإصدارات إنترنت أكسبلورير حتى الإصدار 11 منها xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { document.getElementById("txtHint").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","gethint.php?q="+str,true); xmlhttp.send(); } </script> </head> <body><p><b> </b></p> <form> كلمة البحث <input type="text" onkeyup="showHint(this.value)" size="20" /> </form> <p>الإقتراحات : <span id="txtHint"></span></p> </body> </html>إذا كان حقل الإدخال فارغ "str.length==0" سيتم إخفاء المحتوى من "التلميح" و إنهاء عمل التعليمة و إلا ستقوم التعليمة "showHint" بإنشاء كائن "XMLHttpRequest" و إرسال طلب إلى ملف المخدّم لإظهار التلميحات.
  25. تقوم "SimpleXML" بأخذ أسطرقليلة من "شيفرة" لقراءة البيانات من العنصر و تحويل صفحة الـ"XML" إلى كائن بحيث يتم تحويل العناصر إلى إمتدادات من خلال الكائن الآخر "SimpleXMLElement" وذلك عندما يكون أكثر من عنصر واحد، ويقوم بتصنيفهم و تخزينهم ضمن مصفوفة جديدة حيث تكون هذه المصفوفة مرتّبة من خلال اسم الإمتداد. تعتبر تعليمة "SimpleXML" من أحد أساسيات "PHP5" و يمكن إستخدامها كما في المثال التالي: <?php <?xml version="1.0" encoding="ISO-8859-1"?> <note> <to>Tove</to> <from>Jani</from> <heading>Reminder</heading> <body>Don't forget me this weekend!</body> </note> $xml = simplexml_load_file("test.xml"); echo $xml->getName() . "<br />"; foreach($xml->children() as $child) { echo $child->getName() . ": " . $child . "<br />"; } ?>
×
×
  • أضف...