Question

请允许我快速提及我对这些编码内容的全新内容，所以如果我需要用茶匙做的话，我很抱歉。

我尝试使用已完成的java脚本文件，使用html在我的页面上显示一些数据。

这是javascript：

var Dictionary = function(words) {

this.search = function(query) {
    var pattern = new RegExp(query, "i"); // i - ignore case
    return $.grep(words, function(w) {
        return pattern.test(w);
    });
};


this.size = function() {
    return words.length;
}


this.all = function() {
    return words;
}

}

我现在唯一的任务就是显示这个＆＃34;单词＆＃34;它提到的变量，但我无法弄清楚如何使用html显示它，即使看起来大部分工作都是在javascript中完成的。

我已经尝试了一些绝望的事情，例如＆＃34; return.dictionary＆＃34;，但那并没有做任何事情。我希望你能帮助我。

我的HTML：

<!DOCTYPE html>

<!--
  SAMABARBEIDSPARTNERE:

-->

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>IS-104 Søkeside (LAB1)</title>

<!-- Aktuelle Javascript biblioteker laste inn her -->
<!-- Last inn en versjon av jquery her -->
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="lab1-words-small.json"></script>

<script type="text/javascript" src="lab1-dictionary.js"></script>

<script type="text/javascript">
// <![CDATA[

// Here er en "hack" for å kunne tvinge denne delen av JavaScript koden å kjøre
// etter at resten av siden er ferdig lastet i din nettleser.
$(document).ready(function() {
    var dict = new Dictionary(words);
    // Din kode kan skrives her

});

// ]]>
</script>


-->
<style type="text/css">

/* Eventuelt din CSS her. Dette er kun et eksempel. */
    html {
        background-color: #C0C0C0;
    }
    h1{
        font-family: Verdana, Serif;
        text-align: center;
    }

    nav ul{height:200px; width:18%; background-color: #FFFFFF; margin: auto; position: relative; right:50px}
    nav ul{overflow:hidden; overflow-y:scroll;}

    form{
        width:500px;
        margin:50px auto;
        position: relative;
        left: 95px;
    }
</style>

</head>
<body style="align:center">
<!-- Din HTML skrives her -->
    <h1>
        Dette er en liste og søkeside for en ordbok.
    </h1>
    <form>
        <input type="text" placeholder="Search..." required>
        <input type="button" value="Search">

    </form>
    <nav>
        <ul>
            <li>List 1</li>
            <li>List 2</li>
            <li>List 3</li>
            <li>List 4</li>
            <li>List 5</li>
            <li>List 6</li> 
            <li>List 7</li> 
            <li>List 8</li>
            <li>List 9</li>
            <li>List 10</li>
            <li>List 11</li>
            <li>List 13</li>
            <li>List 13</li>
        </ul>
    </nav>
    <!--<div style="width:500px; height:50px; background-color:grey; margin: auto; position: relative; bottom: 300px;"></div> -->

    <script>{
    var Dictionary = function(words) {...},
            words = Dictionary(words);

            document.getElementbyId("some_id").innerHTML= words; 
    }

    </script>

    <div id="ordid">

    </div>

</body>
</html>

Answer 1

您可以使用：

document.write(var_name)

但它会在空白页面上显示输出。替代方案可以是这样使用document.getElementById("some_id").innerHTML：

首先在HTML中创建一个<div>（例如）

<div id="some_id">

</div>

然后在JavaScript中写下这个：

document.getElementById("some_id").innerHTML=var_name;

希望这可以解决问题。

DEMO

<强>更新

看到您添加的HTML后，您需要编写document.getElementById而不是document.getElementbyId

代替document.getElementById("some_id")，您需要写下<div>的ID，我猜是ordid。

<div id="ordid">

</div>

（来自您的代码）

代码的parial Demo。

您可能会在顶部看到10。

显示变量数据

1 个答案: