Question

我是javascript的初学者。我有一个功能，你点击一个单词，每次单击第一个单词后跟随一系列其他单词。一旦显示字符串中的所有单词（从单击单词25次），我想要显示一个链接。我似乎无法弄清楚如何在单击单词后显示链接。

这是我的代码。

<div id="container"> 
    <span onclick="bla();">click on this sentence to show the string of  words</span>
    <div id="words"></div>
</div>

<script>
    var k = 0;

    function bla() {
        var ph = ["word1", "word2", "word3", "word4", "word5","word6", 
            "word7","word8",  "word9", "word10",  
            "word11","word12","word13","14","15","16",
            "17","18","19",
            "20","21","22","23", "24","25" ];
        var container = document.getElementById('words');
        var count = container.length - 25;

        if (k < ph.length) {
            var word = document.createTextNode(ph[k] + ' ');
            container.appendChild(word);
            k++;
        }
    }

    function bla() {
        if (container.length == count) {
            con.appendChild(text1);
            $(text1).fadeIn(500);    
        } 
    }

    var text1 =document.createElement('div');
    text1.innerHTML = '<a href="nightsky.html">
        a few million years in space
        is like, how many years on earth?';

    text1.style.padding ="20px";
    text1.style.display ="none";

    container.addEventListener('click', bla);
    bla();

</script>
</body>
</html>

我正在尝试更多地了解这一点，任何建议或解释都将非常感谢！非常感谢。

Answer 1

好吧，我们一次都是初学者。

我重构了你的代码，因为它没有按照它的编写方式工作。

＆＃13;

var e = { }; // Global variable for elements
var currentWord = -1; // Global variable indicating current word. (-1 = before first word)
// Global variable with words
var myWords =[
  "word1", "word2", "word3", "word4", "word5",
  "word6", "word7", "word8", "word9", "word10",
  "word11", "word12", "word13", "word14", "word15",
  "word16", "word17", "word18", "word19", "word20",
  "word21", "word22", "word23", "word24", "word25"
];
//function that adds the text after all words has been shown
function addText() {
  var text1 =document.createElement('div');
  var link = document.createElement('a');
  link.href = 'nightsky.html';
  link.textContent = 'a few million years in space  is like, how many years on earth?';
  text1.appendChild(link);
  text1.style.padding ="20px";
  e.container.appendChild(text1);
}

function update() {
  // First we must add one to the currentWord variable. There are
  // a couple of ways to do that:
  // pre-increment:  ++currentWord;
  // post-increment:  currentWord++;
  // assignment operator: currentWord += 1;
  // calculate and assign : currentWord = currentWord + 1;
  currentWord += 1;

  // Check if all words has been shown
  if (currentWord < myWords.length) {
    // Show next word
    var word = document.createTextNode( myWords[currentWord] + ' ' );
    e.words.appendChild(word);
  } else {
    // Add text
    // Only add the text is currentWord is identical to myWords.length
    if ( currentWord == myWords.length) addText();
  }
}

function loaded() {
  // Get relevant elements and store them in the variable e
  e.container = document.getElementById('container');
  e.words = document.getElementById('words');
  e.hot = document.getElementById('hot');
  // Add the click-handler to the hot element
  e.hot.addEventListener('click',update);
}

loaded(); // Should be called 'onload' or DOM-ready

＆＃13;

<div id="container">
  <span id="hot">click on this sentence to show the string of words</span>
  <div id="words"></div>
</div>

＆＃13;

如何在对单词进行一定量的点击后显示链接？

1 个答案: