Требуется помощь JavaScript (YQL и JavaScript) - PullRequest
Новая
       2

Требуется помощь JavaScript (YQL и JavaScript)

1 голос
/ 01 декабря 2010

У меня есть этот «адаптированный» код 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>

1 Ответ

1 голос
/ 01 декабря 2010

Переменная 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>
...