Home > Back-end >  Javascript not recognise "src"
Javascript not recognise "src"

Time:10-07

I worte a code on HTML and Javascript, all the code work excellent except of lines 75 and 78. When I check the console about the problem it say:

script.js:78 Uncaught TypeError: Cannot set properties of null (setting 'src') at HTMLButtonElement.document.getElementById.onclick (script.js:78)

its means for: document.getElementById("imgHTA").src="js/photos/show/HTA_s.png" I guess.

I checked couple of time the place of the image and its the correct place and name... If anyone could help me I would be very thankful!

HTML:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>זהה את הקבוצות - ליגת העל</title>
    </head>
    <body align="center">
        <img src="js/photos/liga.png" height="100">
        <h1>משחק - זהה את הקבוצות</h1>
        <p>שים לב: רשום את השם המלא של הקבוצות (כולל סימני פיסוק), אחרת התשובה לא תחשב.</p>

        <p>
            <!ביתר ירושלים>
            <input type="text" id="txtBJ">
            <img id="imgBJ" src="js/photos/hide/BJ_h.png" height="100">
            <!בני סכנין>
            <input type="text" id="txtBS">
            <img id="imgBS" src="js/photos/hide/BS_h.png" height="100">
            <!הפועל באר שבע>
            <input type="text" id="txtHBS">
            <img id="imgHBS" src="js/photos/hide/HBS_h.png" height="100">
        </p>
        
        <p>
            <!הפועל חדרה>
            <input type="text" id="txtHK">
            <img id="imgHK" src="js/photos/hide/HK_h.png" height="100">
            <!הפועל חיפה>
            <input type="text" id="txtHH">
            <img id="imgHH" src="js/photos/hide/HH_h.png" height="100">
            <!הפועל ירושלים>
            <input type="text" id="txtHJ">
            <img id="imgHJ" src="js/photos/hide/HJ_h.png" height="100">
        </p>

        
        <p>
            <!הפועל נוף הגליל>
            <input type="text" id="txtHNH">
            <img id="imgHNH" src="js/photos/hide/HNH_h.png" height="100">
            <!הפועל תל אביב>
            <input type="text" id="txtHTA">
            <img img="imgHTA" src="js/photos/hide/HTA_h.png" height="100">
            <!מכבי חיפה>
            <input type="text" id="txtMH">
            <img id="imgMH" src="js/photos/hide/MH_h.png" height="100">
        </p>

        <p>
            <!מכבי נתניה>
            <input type="text" id="txtMN">
            <img id="imgMN" src="js/photos/hide/MN_h.png" height="100">
            <!מכבי פתח תקווה>
            <input type="text" id="txtMPT">
            <img id="imgMPT" src="js/photos/hide/MPT_h.png" height="100">
            <!מכבי תל אביב>
            <input type="text" id="txtMTA">
            <img id="imgMTA" src="js/photos/hide/MTA_h.png" height="100">
        </p>

        <p>
            <!מס אשדוד>
            <input type="text" id="txtMSA">
            <img id="imgMSA" src="js/photos/hide/MSA_a.png" height="100">
            <!עירוני קריית שמונה>
            <input type="text" id="txtIK8">
            <img id="imgIK8" src="js/photos/hide/IK8_h.png" height="100">
        </p>
        <br/>
        <p>
            <!בדיקה>
            <button id="btn1">בדוק</button>
            <font size="6"><b>
                <p id="p1">ציון</p>
            </b></font>
        </p>
        <script src="js/script.js"></script>
    </body>
</html>

Javascript

let BJ;
let BS;
let HBS;
let HK;
let HH;
let HJ;
let HNH;
let HTA;
let MH;
let MN;
let MPT;
let MTA;
let MSA;
let IK8;

document.getElementById("btn1").onclick = function(){
    BJ = document.getElementById("txtBJ").value;
    BS = document.getElementById("txtBS").value;
    HBS = document.getElementById("txtHBS").value;
    HK = document.getElementById("txtHK").value;
    HH = document.getElementById("txtHH").value;
    HJ = document.getElementById("txtHJ").value;
    HNH = document.getElementById("txtHNH").value;
    HTA = document.getElementById("txtHTA").value;
    MH = document.getElementById("txtMH").value;
    MN = document.getElementById("txtMN").value;
    MPT = document.getElementById("txtMPT").value;
    MTA = document.getElementById("txtMTA").value;
    MSA = document.getElementById("txtMSA").value;
    IK8 = document.getElementById("txtIK8").value;

    if(BJ === 'בית"ר ירושלים') {
        var musBJ = 1;
        document.getElementById("imgBJ").src="js/photos/show/BJ_s.png"
    } else {
        var musBJ = 0;}
    if(BS === "בני סכנין") {
        var musBS = 1;
        document.getElementById("imgBS").src="js/photos/show/BS_s.png"
    } else {
        var musBS = 0;}
    if(HBS === "הפועל באר שבע") {
        var musHBS = 1;
        document.getElementById("imgHBS").src="js/photos/show/HBS_s.png"
    } else if(HBS === "הפועל באר-שבע") {
        var musHBS = 1;
        document.getElementById("imgHBS").src="js/photos/show/HBS_s.png"
    } else {
        var musHBS = 0;}
    if(HK === "הפועל חדרה") {
        var musHK = 1;
        document.getElementById("imgHK").src="js/photos/show/HK_s.png"
    } else {
        var musHK = 0;}
    if(HH === "הפועל חיפה") {
        var musHH = 1;
        document.getElementById("imgHH").src="js/photos/show/HH_s.png"
    } else {
        var musHH = 0;}
    if(HJ === "הפועל ירושלים") {
        var musHJ = 1;
        document.getElementById("imgHJ").src="js/photos/show/HJ_s.png"
    } else {
        var musHJ = 0;}
    if(HNH === "הפועל נוף הגליל") {
        var musHNH = 1;
        document.getElementById("imgHNH").src="js/photos/show/HNH_s.png"
    } else if(HNH === "הפועל נוף-הגליל") {
        var musHNH = 1;
        document.getElementById("imgHNH").src="js/photos/show/HNH_s.png"
    } else {
        var musHNH = 0;}
    if(HTA === "הפועל תל אביב") {
        var musHTA = 1;
        //PROBLEM: not recognise "src"> document.getElementById("imgHTA").src="js/photos/show/HTA_s.png"
    } else if(HTA === "הפועל תל-אביב") {
        var musHTA = 1;
        //PROBLEM: not recognise "src">document.getElementById("imgHTA").src="js/photos/show/HTA_s.png"
    } else {
        var musHTA = 0;}
    if(MH === "מכבי חיפה") {
        var musMH = 1;
        document.getElementById("imgMH").src="js/photos/show/MH_s.png"
    } else {
        var musMH = 0;}
    if(MN === "מכבי נתניה") {
        var musMN = 1;
        document.getElementById("imgMN").src="js/photos/show/MN_s.png"
    } else {
        var musMN = 0;}
    if(MPT === "מכבי פתח תקווה") {
        var musMPT = 1;
        document.getElementById("imgMPT").src="js/photos/show/MPT_s.png"
    } else if(MPT === "מכבי פתח-תקווה") {
        var musMPT = 1;
        document.getElementById("imgMPT").src="js/photos/show/MPT_s.png"
    } else if(MPT === "מכבי פתח תקוה") {
        var musMPT = 1;
        document.getElementById("imgMPT").src="js/photos/show/MPT_s.png"
    } else if(MPT === "מכבי פתח-תקוה") {
        var musMPT = 1;
        document.getElementById("imgMPT").src="js/photos/show/MPT_s.png"
    } else {
        var musMPT = 0;}
    if(MTA === "מכבי תל אביב") {
        var musMTA = 1;
        document.getElementById("imgMTA").src="js/photos/show/MTA_s.png"
    } else if(MTA === "מכבי תל-אביב") {
        var musMTA = 1;
        document.getElementById("imgMTA").src="js/photos/show/MTA_s.png"
    } else {
        var musMTA = 0;}
    if(MSA === "מ.ס. אשדוד"){
        var musMSA = 1;
        document.getElementById("imgMSA").src="js/photos/show/MSA_s.png"
    } else if(MSA === "מ.ס אשדוד"){
        var musMSA = 1;
        document.getElementById("imgMSA").src="js/photos/show/MSA_s.png"
    } else if(MSA === "מועדון ספורט אשדוד"){
        var musMSA = 1;
        document.getElementById("imgMSA").src="js/photos/show/MSA_s.png"
    } else if(MSA === "מועדון-ספורט אשדוד"){
        var musMSA = 1;
        document.getElementById("imgMSA").src="js/photos/show/MSA_s.png"
    } else {
        var musMSA = 0;}
    if(IK8 === "עירוני קרית שמונה") {
        var musIK8 = 1;
        document.getElementById("imgIK8").src="js/photos/show/IK8_s.png"
    } else if(IK8 === "עירוני קריית שמונה") {
        var musIK8 = 1;
        document.getElementById("imgIK8").src="js/photos/show/IK8_s.png"
    } else if(IK8 === "עירוני קרית-שמונה") {
        var musIK8 = 1;
        document.getElementById("imgIK8").src="js/photos/show/IK8_s.png"
    } else if(IK8 === "עירוני קריית-שמונה") {
        var musIK8 = 1;
        document.getElementById("imgIK8").src="js/photos/show/IK8_s.png"
    } else {
        var musIK8 = 0;}

    var mus = musBJ   musBS   musHBS   musHK   musHH   musHJ   musHNH   musHTA   musMH   musMN   musMPT   musMTA   musMSA   musIK8;
    
    document.getElementById("p1").innerHTML = mus   "/14";
    
    console.log(mus);
}

CodePudding user response:

Not a Java question. But the problem is that you put here:

<img img="imgHTA" src="js/photos/hide/HTA_h.png" height="100">

instead of id

CodePudding user response:

You have a typo here: img="imgHTA"; it should be id="imgHTA".

  • Related