Dando18
Dando18

Reputation: 47

javascript won't execute but prints code

I have some html code where the javascript code instead of executing it just shows the javascript code. This might be a simple question or dumb mistake but after searching some websites I can't seem to find the answer

My code:

<!DOCTYPE html>
<html>
<head>
    <title>Daniel's Quicky Links</title>
    <style type="text/css">
        a {
            text-decoration:none;
            color:blue;
        }

        div.author {
            font-size:12px;
            text-align:center;
            position:absolute;
            bottom:0%;
            width:98%;
            margin-left:auto;
            margin-right:auto;
        }
    </style>
</head>
<body>
    <p id="date"><button onClick="printDay()">day</button></p>
    <table border="3" cellpadding="5" cellspacing="0" summary="This is a list of links to help you quickly guide through the internet" width="40%">
        <caption>This is a list of links to help you quickly guide through the internet</caption>
        <tr>
            <th>Link</th>
            <th>Use</th>
        </tr>
        <tr>
            <td><a href="http://google.com" target="_blank">Google</a></td>
            <td>This link is to a great search engine</td>
        </tr>
        <tr>
            <td><a href="http://facebook.com" target="_blank">Facebook</a></td>
            <td>This link is to a great social media outlet</td>
        </tr>
        <tr>
            <td><a href="http://wikipedia.org" target="_blank">Wikipedia</a></td>
            <td>This link is to a great wiki containing information on plenty of topics</td>
        </tr>
        <tr>
            <td><a href="http://ask.com" target="_blank">Ask</a></td>
            <td>This link is to a great forum you can ask questions</td>
        </tr>
    </table>        

    <div class="author"><p>
        <hr width="101%">
        Author: ********</br> 
        Version: 0.1</br>
        Contact: <a href="mailto:*********?Subject=Quicky Links complaint,suggestion,comment&Body=My thoughts on Quicky Links">************</a>
    </p></div

<script type="text/javascript">
        function printDay()
                {
            var x = new String("");
            var day=new Date().getDay();
            switch(day)
                        {
                            case 0:
                                x="Today is Sunday";
                                break;
                            case 1:
                                x="Today is Monday";
                                break;
                            case 2:
                                x="Today is Tuesday";
                                break;
                            case 3:
                                x="Today is Wednesday";
                                break;
                            case 4:
                                x="Today is Thursday";
                                break;
                            case 5:
                                x="Today is Friday";
                                break;
                            case 6:
                                x="Today is Saturday";
                                break;
                            default:
                                x="Day does not exist";
                        }
                        document.getElementById("date").innerHTML=x;
        }
    </script>

</body>
</html>

Thanks in advance! Dando18

Upvotes: 0

Views: 104

Answers (3)

Arun P Johny
Arun P Johny

Reputation: 388436

You have a syntax error in closing one of the div

<div class="author"><p>
    <hr width="101%">
    Author: *********</br> 
    Version: 0.1</br>
    Contact: <a href="mailto:************?Subject=Quicky Links complaint,suggestion,comment&Body=My thoughts on Quicky Links">**********</a>
</p></div> //<-- here the > is missing after </div

Also the function can be simplified using a array instead of switch like

var days = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];

function printDay() {
    var day = new Date().getDay();
    //the default text is not required since the day value will be within the range 0-6
    document.getElementById("date").innerHTML = 'Today is ' + days[day];
}

Upvotes: 4

zuoyan.wu
zuoyan.wu

Reputation: 71

u must close html tag

replace </p></div with </p></div>

Upvotes: 0

John Conde
John Conde

Reputation: 219894

You have an open <div> tag right before your opening tag. This causes the two to be combined and ignored as invalid. As a result your JavaScript is not just plain text content:

</p></div

<script type="text/javascript">

Upvotes: 2

Related Questions