1

我有这个“改编”的 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>  
4

1 回答 1

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>
于 2010-12-01T17:34:28.853 回答