无法将javascript附加到我的HTML中

时间:2015-03-31 02:04:34

标签: javascript jquery html api console.log

好的,所以我试图从api中提取一些数据。我遇到的问题是我能够找到我正在寻找的信息,但是我很难从控制台获取这些信息并进入我的主index.html页面。

这是我的JS代码

var form = $('#search');
var input = $('#search-keyword');
var results = $('#results');

$(document).ready(function() {
  $("#myBtn").on('click', function() {
    var symbol = $("#search-keyword").val();
    $.getJSON("http://dev.markitondemand.com/Api/v2/quote/jsonp?symbol=" + symbol + "&callback=?", function(info) {
        console.log(info);
    });
  });
});

这是我的HTML代码

<div id="search">
  <h1>API Test</h1>
  <input type="search" id="search-keyword">
  <button id="myBtn">Try it</button>
</div>
<div id="results"></div>

通过这样做,我能够得到我正在寻找的东西。但是我无法从控制台获取数据到实际页面。

我试过了appendChild

var bob = document.getElementById(results);
var content = document.createTextNode(info);
bob.appendChild(info);

我尝试过innerHTML

var theDiv = document.getElementById(results);
theDiv.innerHTML += info; 

..我尝试过.append()

$('#myBtn').click(function() {
  $(results).append(info) 
})

我没有想法。我意识到我可能在其他地方遇到一个小问题,我没有看到这可能是其中的根源。非常感谢能够帮助我解决这个问题的任何人。

2 个答案:

答案 0 :(得分:0)

"results"需要使用常规javascript引用,对于jquery,您已经对结果变量进行了decalred。

var theDiv = document.getElementById("results");
theDiv.innerHTML += info; 

$('#myBtn').click(function(){
  results.append(info) 
})

此外,由于您要在文档就绪呼叫之外声明结果,因此您必须确保html出现在javascript之前。

答案 1 :(得分:0)

<script>
var form = $('#search');
var input = $('#search-keyword');
var results = $('#results');

$(document).ready(function() {
  $("#myBtn").on('click', function() {
    var symbol = $("#search-keyword").val();
    var resultedData = $.getJSON("http://dev.markitondemand.com/Api/v2/quote/jsonp?symbol=" + symbol + "&callback=?", function(info) {
        return info;
    });

    var resultDiv = document.getElementById("results");
    resultDiv.innerHTML += resultedData;
  });
});
</script>