Javascript没有正确链接到我的HTML

时间:2015-10-22 05:52:47

标签: javascript html

由于没有正确链接,我似乎无法显示我的java脚本。

我真的不明白我的链接有什么问题。我试图建立一个有功能测验的网站,但自从java不会出现整个事情就变成了kaput。

<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title>Web Quiz</title>
<link type="text/css" rel="stylesheet" href="_assets/_css/quiz.css" media="screen">
<script type="text/javascript" src="jquery.js"></script>            
<script language="JavaScript" type="text/javascript" src="/_assets/_js/quiz2.js"></script>    
</head>    
<body>
<h1>Web Quiz</h1>
<p>Test your Knowledge</p>
<h2 id="test_status"></h2>
<div id="test"></div>
</body> 
</html>

的Javascript

 var pos = 0, area, position, question, choice, choices, chA, chB, chC, chD, correct = 0; 
    var questions = [ 
        [ "Where was Sir Tim Berners-Lee born and in what year?", "London,1955", "California 1957", "Wales,1957", "Ireland,1955", "A" ],
        [ "Who is credited for invented the world wide web?", "Robert Cailliau", "Sir-Tim Berners-Lee", "Both a and b", "Vint Cerf", "A" ],
        [ "Who helped Tim develop the world wide web?", "He didn’t have any help", "Steve Jobs", "Robert Cailliau.", "Vint Cerf", "C" ],
        [ "What was the original intended purpose of the internet?", "A way to connect everyone in the world", "Being able to contact troops stationed in other countries", "Allow all of the government officials to contact each other", "A network to link all prominent scientists and university professors of America", "D" ],
        [ "Who developed the original Internet?", "The FBI", "The CIA", "The US department of Defense", "Bureau of Intelligence and Research", "C" ],
        [ "What event led to the development of the Internet?", "The USA creates ARPA ", "Sputnik launching", "Cold War", "World War 2", "B" ],
        [ "How does Packet Switching work?", "Breaks files into smaller chunks then sends the file", "Attaches other bigger files then sends it", "It refuses to send the file", "The file is sent to Barack Obama", "A" ],
        [ "What does IP stand for?", "Internet Prayer", "Internet Planning", "Internet Protocol", "Internet Please", "C" ],
        [ "What is the purpose for FTP?", "To send computer files from one host to another", "To delete sent files", "To send files to Barack Obama", "To 'Fly Through Ponds'", "A" ],
        [ "When was HTML5 released?", "2000", "2016", "2012", "2014", "C" ],
        [ "How do you insert a header 1 tag in HTML?", "header 1", "h1", "h1", "None of the above", "D" ],
        [ "What should the last tag be in your HTML?", "/body", "/title", "/html", "/", "C" ],
        [ "What is the correct way to insert JavaScript tags in HTML?", "None of these", "Javascript /JavaScript", "/js", "'style'", "A" ],
        [ "What's the first thing you type when starting an HTML page?", "docTYPE html", "doctype htm", "DOCtype html", "None of the above", "D" ],
        [ "How do you link an external CSS in HTML?", "href='assets/css/(css name).css'", "href='assets/css/(css_name).css'", "href='assets/css/(css_name).css'", "href='assets/css/(css_name).js'", "A" ],
        [ "What will happen using the pimpmyride tag?", "Creates a new pimpmyride HTML tag", "Nothing because it is not a valid tag", "A car appears on your screen and drives you away", "Pimps your car for you in HTML", "B" ],
        [ "The div tag does what?", "Creates a container on your HTML which holds a chunk of content", "Targets multiple elements", "Targets all elements", "Targets all but one element", "C" ],
        [ "How do you close a tag?", "Add '/'' before the tag", "Add '/' after the tag", "Add '/' after the first letter", "You don't at all", "A" ],
        [ "What should go first in the HTML page?", "internal CSS page", "div tags", "content", "Nyan Cat", "C" ],
        [ "How do you assign the id 'flavor' to a div' tag?", "div's name is 'flavor'", "div id='flavor'", "/div id='flavor'", "None of the above", "B" ],
        [ "What is the correct HEX code for RED?", "red", "#FF0000", "#F00000", "#0000FF", "B" ],
        [ "What does CSS stand for?", "Cascading Style Sheets", "Changing Sturdy Stance", "Cascadng Style Sheets", "Corona Still Sober", "A" ],
        [ "What is CSS used for?", "Many Things", "Styling HTML pages", "Styling your clothes", "Styling only one element in JavaScript", "B" ],
        [ "How do you target the body element in CSS?", "Come here beautiful", "'/body'", "b", "body{}", "D" ],
        [ "What can CSS be used for other than making your HTML pretty?", "Add pictures", "Change the color of your text", "Create animations for your buttons or content", "Resize images", "C" ],
        [ "Which of these is correct syntax?", "body {margin is 10px}", "body margin: 10px;", "body {margin: 10px;}", "body = margin: 10px;}", "C" ],
        [ "When should the CSS load in an HTML page?", "Before the content", "After the content", "Before the double rainbow", "After the double rainbow", "B" ],
        [ "What's the difference between padding and margin?", "They're the same", "Padding is the spacing between the content and the border while margin is the space outside the border", "Margin the the the space between the content and the border while the margin is the space outside the border", "Margin is the space to the left and right of the content while padding is the space above and below", "B" ],
        [ "How do you set a padding of 10 pixels ABOVE the content?", "{margin-top: 10px;}", "{margin-up: 10px;}", "{margin-above 10px;}", "{margin-top 10px;}", "A" ],
        [ "How do you target the div class in CSS?", "#div", "class=div", ".div", "div class", "C" ],
        [ "What's a good habit in JavaScript?", "Place 'var' in front of every variable", "Place 'var' after every variable", "Place 'var' at the end of the body tag", "Always put a semicolon at the end of your code", "D" ],
        [ "What's the purpose of 'if else' statements in JavaScript?", "To report others of hacking", "To execute certain code if the conditions are right", "To execute code after an earthquake", "To execute code if HTML allows it ", "B" ],
        [ "What happens when: var myArray = [1, 2, 3, 4, 5]; var newArray = myArray.shift();", "1, 2, 3, 4", "2, 3, 4, 5", "5, 4, 3, 2, 1", "2, 1, 4, 5", "B" ],
        [ "What does 'pop' do in JavaScript?", "Removes the last item in an array", "Removes the first item in an array", "Adds an item to the beginning of an array", "Adds an item to the end of an array", "A" ],
        [ "What returns when: var myArray = [1, 2, 3, 4, 5]; var newArray = myArray.push; var otherArray = ['Sober']; console.log(otherArray);", "Sober", "1,2,3,4,5", "2,3,4,5", "Nothing at all", "A" ],
        [ "Which of these is a function?", "{return a * b;}", "functionn {return ab;}", "function myFunction(a, b) {return a * b;}", "padding: 25px;", "C" ],
        [ "What keys do you press to turn all highlighted text into comments on a MAC?", "Command + Tab", "Command + Backslash ", "Command + Forward Slash", "Alt + Shift", "C" ],
        [ "What can you do to check for any errors in your code?", "Hack it", "Check the developers console in your browser", "If, else statement", "console.log();", "B" ],
        [ "What does a prompt do?", "It assures the user that Siri is cool", "It asks the user to type 'Pikachu'", "It prompts the user to type only numbers", "It prompts the user to type something into a text field", "B" ],
        [ "What is the main purpose for JavaScript?", "Style", "Information", "Interactability", "Networking", "C" ]
    ];

    function_(x) {
        return document.getElementById(x);
    }
    function loadQuestion(){ 
        area = getId("area");
        if(pos >= questions.length){
            area.innerHTML = "<h2>" + "You got "+correct+" of "+questions.length+" questions 
            correct </h2>";
            getId("progress").innerHTML = "You've completed the test!";
            pos = 0; 
            correct = 0; 
            return false; 
        }
        getId("progress").innerHTML = "Question "+(pos+1)+" of "+questions.length; //Shows you what question you are on
        question = questions[pos][0]; 
        chA = questions[pos][1];
        chB = questions[pos][2];
        chC = questions[pos][3];
        chD = questions[pos][4];
        area.innerHTML = "<h3>"+question+"</h3>"; 
        area.innerHTML += "<input type='radio' name='choices' value='A'> "+chA+"<br>";
        area.innerHTML += "<input type='radio' name='choices' value='B'> "+chB+"<br>";
        area.innerHTML += "<input type='radio' name='choices' value='C'> "+chC +"<br>";
        area.innerHTML += "<input type='radio' name='choices' value='D'> "+chD+"<br>";
        area.innerHTML += "<button onclick='checkAnswer()'> Submit Yo Answer</button>";
    }
    function checkAnswer(){ 
        choices = document.getElementsByName("choices");
        for (var i=0; i<choices.length; i++){
            if(choices[i].checked){
                choice = choices[i].value;
            }
        }
        if(choice == questions[pos][5]){
            correct++;
        }
        pos++; 
        loadQuestion();
    }
    window.addEventListener("load", loadQuestion, false); 

3 个答案:

答案 0 :(得分:0)

改变这个:

<script type="text/javascript" src="/_assets/_js/quiz2.js"></script>

对此:

<script type="text/javascript" src="_assets/_js/quiz2.js"></script>

当您在开头添加/时,它将使用绝对路径而不是相对路径。鉴于您的CSS正在运行并且您正在使用该文件的相对路径,您应该也可以使用JS的相对路径。

答案 1 :(得分:0)

对于这个答案,我假设你_assets文件夹在你的HTML文件目录中。

更新脚本标记的来源。在开始源之前添加一个点(。)或从源中删除正斜杠(/)。以下是您的问题解决方案的两种可能性。

<强> SRC = “_资产/ _js / quiz2.js”

<强> SRC = “./_资产/ _js / quiz2.js”

答案 2 :(得分:0)

您的JavaScript中存在拼写错误:

function_(x) {
    return document.getElementById(x);
}

删除function关键字后面的下划线。此功能还需要一个名称。我想这应该是&#34; getId&#34;功能。

还有许多其他错误,例如没有带有&#34;进展的元素&#34;或&#34;区域&#34; ID。检查浏览器控制台,它通常会告诉您代码何时出现类似问题。

我为您修正了错误:

1将这些添加到您的HTML

<div id="progress"></div>
<div id="area"></div>

2用这个替换你破碎的功能:

function getId (x) {
    return document.getElementById(x);
}

3删除loadQuesion函数中的非法新行。所以改变这个

area.innerHTML = "<h2>" + "You got "+correct+" of "+questions.length+" questions 
        correct </h2>"; 

到此:

area.innerHTML = "<h2>" + "You got "+correct+" of "+questions.length+" questions correct </h2>";