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

مشكلة تضمين ملفات جافاسكريبت في ملف html

Mahmoud Ali Nawwar

السؤال

Recommended Posts

  • 1
بتاريخ 12 ساعات قال Mahmoud Ali Nawwar:

ما الخطأ في هذا الكود

عندما أفتح المتصفح لا يظهر شئ

project (2).zip

إذا قمت بتضمين ملف ال JavaScript بشكل صحيح باستخدام الوسم script كما أخبرتك في إجابة على السؤال السابق

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="css/style.css">
    <!--تضمين ملف جافاسكربت-->
    <script src="script/script.js"></script>
</head>

<body>

</body>

</html>

ستلاحظ ظهور الخطأ التالي في ال console في المتصفح:

Uncaught SyntaxError: Invalid or unexpected token   script.js:10 

و الذي يخبرك بوجود خطأ متعلق بقواعد كتابة اللغة في السطر رقم 10، و بالنظر إلى هذا السطر في الكود سنجد أنه السطر الذي قمت بتعريف المتغير mark فيه

let mark = '
<div class= "card">
<div class= "child">
<h1> TITLE</h1>
<P> HELLO FREINDS</P>
</div>
</div>
';

طيب، ما هو الخطأ الذي خالف قواعد اللغة هنا؟

الخطأ هو استخدامك لعلامة التنصيص العادية ' ' لوضع أكواد ال html بداخلها، حيث أنه يفترض وضعها داخل backtick"شرطة مائلة" ` ` كما يلي حتى تتمكن من كتابة السلسلة النصية في أكثر من سطر، حيث أن جافاسكريبت لا تدعم ال multiple line strings بشكل افتراضي و إنما تدعم السلاسل النصية ذات السطر الواحد فقط. لذلك في es6 تمت إضافة الشرطة المائلة `` لعدة أسباب منها كتابة متغيرات داخل السلاسل النصية و كتابة سلاسل نصية في أكثر من سطر:

let mark = `
    <div class= "card">
        <div class= "child">
            <h1> TITLE</h1>
            <P> HELLO FREINDS</P>
        </div>
    </div>
`;

و سيعمل بشكل صحيح:

610e6687b960a_Screenshot(2).thumb.png.9d4b5fce725d4d6f5c0239e87a4bb8b7.png

المشروع الخاص بك بعد التعديل: project.zip 

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

لقد قمت بتضمين ملف الجافاسكريبت بالعنصر الخاص بتضمين CSS كالآتي

<link rel="stylesheet" href="script/script.js">

وهذا خطأ هذا أنك تقوم بتضمين جافاسكريبت بإستخدام عنصر آخر يسمى script كالآتي

<script src="script/script.js"></script>

وكان يظهر خطأ أنك تقوم بإستدعاء ملف CSS ليست صيغته .css لأنك كنت تقوم بتضمين ملف جافاسكريبت الذي صيغته .js 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0
بتاريخ 5 ساعات قال Mahmoud Ali Nawwar:

قمت بتعديله ولكن لا توجد اسـتجابة للأمر document.write()

بالإضافة إلى إجابة المدرب عبدالمجيد , ايضا يمكنك إزالة الأسطر من بين الكلمات في السطر التالي 

let mark = '
<div class= "card">
<div class= "child">
<h1> TITLE</h1>
<P> HELLO FREINDS</P>
</div>
</div>
';

وجعل الكلمات و الوسوم متلاصقة لأن جافاسكريبت حساسة لحالة الأحرف و الفراغات فيمكنك جعل الوسوم متلاصقة ببعضها في سطر واحد مثل الكود التالي

let mark = '<div class= "card"><div class= "child"><h1> TITLE</h1><P> HELLO FREINDS</P></div></div>';

ثم تقوم بتجربة تنفيذ الكود مرة أخرى ستجد أن الكود يعمل بشكلٍ جيد.

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...