Question

我有这个“改编的”javascript代码来显示有关任何事物的有趣事实（在这种情况下关于电影和/或历史）但是，它构建为一次只显示一个事实，用户需要按一个按钮才能显示另一个有趣的事实。

我的问题是，有没有办法一次显示所有事实，而不是一次显示一个？

function funfacts(o){
  var facts = document.getElementById('funfacts');
  facts.className = 'js';
  if(facts){
    var data = o.query.results.p;
    var link = facts.getElementsByTagName('a')[0];
    link.innerHTML = '(see all facts)';
    var out = document.createElement('p');
    out.className = 'fact';
    facts.insertBefore(out,link.parentNode);
    function seed(){
      var ran = parseInt(Math.random()*data.length);
      out.innerHTML = data[ran];
    }
    var b = document.createElement('button');
    b.innerHTML = 'get another fact';
    b.onclick = seed;
    link.parentNode.insertBefore(b,link);
    seed();
  }
}

  <script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D'http%3A%2F%2Fwww.tealdragon.net%2Fhumor%2Ffacts%2Ffacts.htm'%20and%20xpath%3D'%2F%2Fli%2Fp'&format=json&diagnostics=true&callback=funfacts"></script>

Answer 1

变量data包含数组中的所有事实。当用户点击时，函数seed会从数组中随机选择一个项目。

所以，要全部显示它们：

out.innerHTML = data.join("<br />");

这将事实连接成一个字符串，用换行符分隔。

编辑添加：

以下是一个完整，非常简单的网页示例，其中显示了所有项目：

<html>
<body>
<div id="funfacts">
</div>
<script>
function funfacts(o){
  var facts = document.getElementById('funfacts');
  if(facts){
    var data = o.query.results.p;
    var out = document.createElement('p');
    out.className = 'fact';
    facts.appendChild(out);
    out.innerHTML = data.join("<br />");
  }
}
</script>
<script src="http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D'http%3A%2F%2Fwww.tealdragon.net%2Fhumor%2Ffacts%2Ffacts.htm'%20and%20xpath%3D'%2F%2Fli%2Fp'&format=json&diagnostics=true&callback=funfacts"></script>

</body>
</html>

需要JavaScript帮助（YQL和JavaScript）

1 个答案: