حول كتابة التعليمات البرمجية في Dreamweaver

تاريخ آخر تحديث 27‏/04‏/2021

تعرف على كيفية دعم Dreamweaver للغات كتابة التعليمات البرمجية المختلفة المستخدمة لإنشاء مواقع الويب.

لغات البرمجة الأكثر شيوعًا المستخدمة لتصميم وتطوير مواقع ويب كاملة الوظائف هي HTML وHTML5 وCSS للواجهة، وPHP وJavaScript وJava وjQuery للخلفية.

يمكنك تصميم مظهر موقع الويب (مثل الخطوط، والألوان) عبر موقع الويب باستخدام CSS. ويمكنك بعد ذلك استخدام HTML لإدراج الصور، والنصوص، ومقاطع الفيديو، والنماذج، وغيرها من أجزاء المحتوى معًا في صفحة ويب متناسقة.

يمكنك إنشاء موقع ثابت باستخدام CSS وHTML معًا. ومع ذلك، تتطلب غالبية مواقع الويب بعض أشكال التفاعل (مثل أن يُطلب من أحد العملاء ملء نموذج، أو إجراء عملية دفع) وقاعدة بيانات لتخزين جميع البيانات الخاصة بموقع الويب

ولإنشاء قنوات الاتصال الخلفية هذه، ستكون بحاجة إلى لغة برمجة على جانب الخادم (مثل PHP) تستطيع الاتصال مع قاعدة البيانات.

لغات البرمجة المدعومة بواسطة Dreamweaver

بالإضافة إلى إمكانيات تحرير النصوص، يوفر Adobe Dreamweaver ميزات مختلفة، مثل تلميحات التعليمات البرمجية، لمساعدتك على كتابة التعليمات البرمجية باللغات التالية:

  • HTML
  • PHP
  • CSS
  • JavaScript

اللغات الأخرى، مثل Perl، لا تدعمها ميزات كتابة التعليمات البرمجية الخاصة بكل لغة في Dreamweaver؛ على سبيل المثال، يمكنك إنشاء وتعديل ملفات Perl، لكن تلميحات الكود لا تنطبق على تلك اللغة.

التعديل التلقائي للتعليمات البرمجية

يمكنك تعيين خيارات توجه Dreamweaver لتنظيف رمزك المكتوب يدوياً تلقائياً وفقاً للمعايير التي تحددها.ومع ذلك، لا تتم إعادة كتابة رمزك أبداً ما لم يتم تمكين خيارات إعادة كتابة الرمز أو تقوم بإجراء يغير الرمز.على سبيل المثال، لا يغير Dreamweaver المسافات الفارغة أو يغير حالة الخصائص إلا إذا استخدمت أمر تطبيق تنسيق المصدر.

و يتم تمكين بعض خيارات إعادة كتابة التعليمات البرمجية هذه افتراضيًا.

تتيح لك إمكانيات HTML ذهاباً وإياباً في Dreamweaver نقل مستنداتك ذهاباً وإياباً بين محرر HTML النصي و Dreamweaver مع تأثير قليل أو معدوم على المحتوى وبنية رمز HTML المصدر الأصلي للمستند.تتضمن هذه الإمكانيات ما يلي:

  • استخدام محرر نصوص تابع لجهة أخرى لتحرير المستند الحالي.

  • بشكل افتراضي، لا يُجري Dreamweaver تغييرات في الكود المُنشأ أو المُعدل في محررات HTML الأخرى، حتى لو كان الكود غير صالح، إلا إذا قمت بتمكين خيارات إعادة كتابة الكود.

  • لا يغير Dreamweaver العلامات التي لا يتعرف عليها—بما في ذلك علامات XML—لأنه لا يملك معايير للحكم عليها.إذا تداخلت علامة غير معروفة مع علامة أخرى (على سبيل المثال، <MyNewTag><em>text</MyNewTag></em>)، يضع Dreamweaver عليها علامة خطأ لكنه لا يعيد كتابة الكود.

  • اختيارياً، يمكنك تعيين Dreamweaver لتمييز الرمز غير الصحيح في عرض الرمز (باللون الأصفر).عند تحديد قسم مميز، يعرض مفتش الخصائص معلومات حول كيفية تصحيح الخطأ.

تعليمات XHTML البرمجية

ينشئ Dreamweaver رمز XHTML جديد وينظف رمز XHTML الموجود بطريقة تلبي معظم متطلبات XHTML.كما تُوفر أيضاً الأدوات التي تحتاجها لتلبية متطلبات XHTML القليلة المتبقية.

ملاحظة

بعض المتطلبات مطلوبة أيضاً في إصدارات مختلفة من HTML.

يوضح الجدول التالي متطلبات XHTML التي يتوافق معها Dreamweaver تلقائيًا:

متطلبات XHTML

الإجراءات التي ينفذها Dreamweaver

يجب أن يكون هناك إعلان DOCTYPE في المستند قبل العنصر الجذر، ويجب أن يشير الإعلان إلى أحد ملفات تعريف نوع المستند الثلاثة (DTD) لـ XHTML (صارم، انتقالي، أو مجموعة إطارات).

إضافة XHTML DOCTYPE إلى مستند XHTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

أو، إذا كان مستند XHTML يحتوي على مجموعة إطارات:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

يجب أن يكون العنصر الجذر للمستند html، ويجب أن يحدد عنصر html مساحة أسماء XHTML.

يضيف خاصية namespace إلى عنصر html، كما يلي:

<html xmlns="http://www.w3.org/1999/xhtml">

يجب أن يحتوي المستند القياسي على العناصر الهيكلية head، title، و body.يجب أن يحتوي مستند الإطارات على العناصر الهيكلية head، title، و frameset.

في المستند القياسي، يتضمن عناصر head، title، و body.في مستند إطار العمل، يتضمن عناصر head، title، و frameset.

يجب تداخل جميع العناصر في المستند بشكل صحيح:

<p>هذا مثال <i>سيء.</p></i> <p>هذا مثال <i>جيد.</i></p>

ينشئ تعليمة برمجية متداخلة بشكل صحيح، وعند تنظيف XHTML، يصحح التداخل في التعليمة البرمجية التي لم يتم إنشاؤها بواسطة Dreamweaver.

يجب أن تكون جميع أسماء العناصر والسمات بأحرف صغيرة.

يفرض أن تكون أسماء عناصر HTML وسماتها بأحرف صغيرة في كود XHTML الذي ينشئه وعند تنظيف XHTML، بغض النظر عن تفضيلات حالة العلامات والسمات لديك.

يجب أن يحتوي كل عنصر على علامة إغلاق، ما لم يتم الإعلان عنه في DTD كـ EMPTY.

يدرِج علامات الإغلاق في التعليمة البرمجية التي ينشئها، وعند تنظيف XHTML.

يجب أن تحتوي العناصر الفارغة على علامة إغلاق، أو يجب أن تنتهي علامة الفتح بـ />. على سبيل المثال، <br> غير صالح؛ الشكل الصحيح هو <br></br> أو <br/>. فيما يلي العناصر الفارغة: area، base، basefont، br، col، frame، hr، img، input، isindex، link، meta، و param.

وللتوافق مع الإصدارات السابقة مع المتصفحات التي لا تدعم XML، يجب أن تكون هناك مسافة قبل /> (على سبيل المثال، <br />، وليس <br/>).

يدرج العناصر الفارغة مع مسافة قبل الشرطة المائلة المغلقة في العلامات الفارغة في الكود الذي ينشئه، وعند تنظيف XHTML.

لا يمكن تقليل السمات؛ على سبيل المثال، <td nowrap> غير صالح؛ الشكل الصحيح هو <td nowrap="nowrap">.

هذا يؤثر على السمات التالية: checked، compact، declare، defer، disabled، ismap، multiple، noresize، noshade، nowrap، readonly، و selected.

يدرِج أزواج قيمة-سمة كاملة في التعليمة البرمجية التي ينشئها، وعند تنظيف XHTML.

ملاحظة: إذا كان متصفح HTML لا يدعم HTML 4، فقد يفشل في تفسير هذه السمات المنطقية عندما تظهر بشكلها الكامل.

يجب أن تكون جميع قيم السمات محاطة بعلامات اقتباس.

يضع علامات اقتباس حول قيم السمات في التعليمة البرمجية التي ينشئها، وعند تنظيف XHTML.

يجب أن تحتوي العناصر التالية على سمة id وكذلك سمة name: a، applet، form، frame، iframe، img، و map. على سبيل المثال، <a name="intro">Introduction</a> غير صالح؛ الشكل الصحيح هو

<a id="intro">Introduction</a> أو <a id="section1" name="intro"> Introduction</a>.

يضبط خاصيتي name و id على نفس القيمة، كلما تم تعيين خاصية name بواسطة مفتش الخصائص، في الكود الذي ينشئه Dreamweaver، وعند تنظيف XHTML.

للسمات ذات القيم من النوع المعدود، يجب أن تكون القيم بأحرف صغيرة.

قيمة النوع المعدود هي قيمة من قائمة محددة من القيم المسموحة؛ على سبيل المثال، السمة align لها القيم المسموحة التالية: center، justify، left، و right.

يفرض أن تكون قيم النوع المعدود بأحرف صغيرة في التعليمة البرمجية التي ينشئها، وعند تنظيف XHTML.

يجب أن تحتوي جميع عناصر script وstyle على سمة type.

(إن خاصية type في عنصر script مطلوبة منذ HTML 4، عندما تم إيقاف استخدام خاصية language.)

يضبط خاصيتي type وlanguage في عناصر script، وخاصية type في عناصر style، في الكود الذي ينشئه وعند تنظيف XHTML.

يجب أن تحتوي جميع عناصر img وarea على خاصية alt.

يضبط هذه السمات في الكود الذي ينشئه، وعند تنظيف XHTML، يبلغ عن سمات alt المفقودة.

التعبيرات العادية

التعبيرات النمطية هي أنماط تصف تركيبات الأحرف في النص.استخدمها في عمليات البحث في الشفرة للمساعدة في وصف مفاهيم مثل الأسطر التي تبدأ بـ "var" وقيم السمات التي تحتوي على رقم.

يسرد الجدول التالي الأحرف الخاصة في التعبيرات النمطية ومعانيها وأمثلة الاستخدام.للبحث عن نص يحتوي على أحد الأحرف الخاصة في الجدول، قم بإضافة شرطة مائلة عكسية قبل الحرف الخاص.على سبيل المثال، للبحث عن علامة النجمة الفعلية في العبارة some conditions apply*، قد يبدو نمط البحث الخاص بك هكذا: apply\*. إذا لم تقم بحماية علامة النجمة، ستجد جميع حالات "apply" (وكذلك أي من "appl" و"applyy" و"applyyy")، وليس فقط تلك المتبوعة بعلامة نجمة.

الحرف

يطابق

مثال

^

بدء إدخال أو سطر.

^T يطابق "T" في "This good earth" وليس في "Uncle Tom's Cabin"

$

نهاية إدخال أو سطر.

h$ يطابق "h" في "teach" وليس في "teacher"

*

الحرف السابق بمرة أو أقل أو أكثر.

um* يطابق "um" في "rum"، "umm" في "yummy"، و"u" في "huge"

+

الحرف السابق بمرة أو أكثر.

um+ يطابق "um" في "rum" و"umm" في "yummy" لكن لا شيء في "huge"

?

الحرف السابق مرة واحدة على الأكثر (أي يشير إلى أن الحرف السابق اختياري).

st?on يطابق "son" في "Johnson" و"ston" في "Johnston" لكن لا شيء في "Appleton" أو "tension"

.

أي حرف واحد عدا السطر الجديد.

.an يطابق "ran" و"can" في العبارة "bran muffins can be tasty"

x|y

إما x أو y.

FF0000|0000FF يطابق "FF0000" في bgcolor="#FF0000" و"0000FF'" في font color="#0000FF"

{n}

عدد تكرارات n بالضبط للحرف السابق.

o{2} يطابق "oo" في "loom" وأول حرفين o في "mooooo" لكن لا شيء في "money"

{n,m}

على الأقل n، وعلى الأكثر m، من تكرارات الحرف السابق.

F{2,4} يطابق "FF" في "#FF0000" وأول أربعة أحرف F في #FFFFFF

[abc]

أي من الأحرف المحاطة بالأقواس المربعة.حدد نطاق من الأحرف بشرطة (على سبيل المثال، [a-f] يعادل [abcdef]).

[e-g] يطابق "e" في "bed"، و"f" في "folly"، و"g" في "guard"

[^abc]

أي حرف غير محاط بأقواس. حدد نطاق من الأحرف بشرطة (على سبيل المثال، [^a-f] يعادل [^abcdef]).

[^aeiou] يطابق في البداية "r" في "orange" و "b" في "book" و "k" في "eek!"

\b

حد كلمة (مثل المسافة أو حرف السطر الجديد).

\bb يطابق "b" في "book" ولكن لا يطابق شيئاً في "goober" أو "snob"

\B

أي شيء سوى حد الكلمة.

\Bb يطابق "b" في "goober" ولكن لا شيء في "book"

\d

أي رقم. يعادل النطاق [0-9].

\d يطابق "3" في "C3PO" و"2" في "apartment 2G"

\D

أي حرف غير الأرقام. يعادل النطاق [^0-9].

\D يطابق "S" في "900S" و"Q" في "Q45"

\f

تغذية النموذج.

\n

تغذية السطر.

\r

حرف السطر الجديد.

\s

أي حرف مسافة بيضاء واحد، بما في ذلك المسافة وعلامة التبويب وتغذية النموذج أو تغذية الخط.

\sbook يطابق "book" في "blue book" ولكن لا شيء في "notebook"

\S

أي حرف واحد ليس مسافة بيضاء.

\Sbook يطابق "book" في "notebook" ولكن لا شيء في "blue book"

\t

حرف الجدولة.

\w

أي حرف أبجدي رقمي، بما في ذلك علامة الشرطة السفلية. يعادل النطاق [A-Za-z0-9_].

b\w* يطابق "barking" في "the barking dog" وكل من "big" و"black" في "the big black dog"

\W

أي حرف غير أبجدي رقمي. يعادل [^A-Za-z0-9_].

\W يطابق "&" في "Jake&Mattie" و"%" في "100%"

Control+Enter أو Shift+Enter (Windows)، أو Control+Return أو Shift+Return أو Command+Return (Macintosh)

حرف إرجاع. تأكد من إلغاء تحديد خيار تجاهل اختلافات المسافات البيضاء عند البحث عن هذا، إذا لم تكن تستخدم التعبيرات العادية.لاحظ أن هذا يطابق حرفاً معيناً وليس المفهوم العام لكسر الخط؛ على سبيل المثال، لا يطابق علامة <br> أو علامة <p>. تظهر أحرف الإرجاع كمسافات في طريقة العرض Design، وليس كفواصل أسطر.

استخدم الأقواس لفصل المجموعات داخل التعبير العادي للإشارة إليها لاحقاً.ثم استخدم $1 و$2 و$3 وما إلى ذلك في حقل استبدال بـ للإشارة إلى المجموعات الأولى والثانية والثالثة واللاحقة للأقواس.

ملاحظة

في مربع "البحث عن"، للإشارة إلى مجموعة أقواس سابقة في التعبير العادي، استخدم \1 و\2 و\3 وما إلى ذلك بدلاً من $1 و$2 و$3.

على سبيل المثال، البحث عن (\d+)\/(\d+)\/(\d+) واستبداله بـ $2/$1/$3 يبدل اليوم والشهر في تاريخ مفصول بـ شرطات مائلة، وبالتالي يحول بين التواريخ الأمريكية والتواريخ الأوروبية.

التعليمة البرمجية لسلوك الخادم

عند تطوير صفحة ديناميكية وتحديد سلوك خادم من لوحة سلوكيات الخادم، يدرج Dreamweaver كتلة كود واحدة أو أكثر في صفحتك لجعل سلوك الخادم يعمل.

إذا قمت بتغيير الكود يدوياً داخل كتلة كود، فلن تتمكن من استخدام لوحات مثل لوحة الربط ولوحة سلوكيات الخادم لتعديل سلوك الخادم.يبحث Dreamweaver عن أنماط محددة في كود الصفحة لاكتشاف سلوكيات الخادم وعرضها في لوحة سلوكيات الخادم.إذا غيرت كود كتلة الكود بأي طريقة، فلن يتمكن Dreamweaver من اكتشاف سلوك الخادم وعرضه في لوحة سلوكيات الخادم.ومع ذلك، لا يزال سلوك الخادم موجوداً على الصفحة، ويمكنك تعديله في بيئة البرمجة في Dreamweaver.