Question

我知道这似乎很基础，但是我是新手，因此想了解这实际上意味着什么，请帮忙。

我试图复制以下内容，但是我发现这很困难，因为我不太了解这段代码的作用。

function animate_string(id) 
{
    var element = document.getElementById(id);
    var textNode = element.childNodes[0]; // assuming no other children
    var text = textNode.data;

setInterval(function () 
{
 text = text[text.length - 1] + text.substring(0, text.length - 1);
  textNode.data = text;
}, 100);
}

这显然应该设置为作为参数（id）传递的字符串id的动画，并且该间隔似乎对我不起作用。

Answer 1

// Create a function called animate_string with id as parameter.
function animate_string(id) 
{
    // Search a HTML element with the given parameter id
    var element = document.getElementById(id);
    
    // Childnodes gives a list of al the childnodes, childNodes[0] gives the first one
    // (In this case, the only one)
    var textNode = element.childNodes[0];
    
    // Save the text from that first child node into variable.
    var text = textNode.data;
    
    // Set interval repeats the function given as the first parameter
    // and the time to wait in MS as second one. In this case 100 ms
    setInterval(function () 
    {
     // Resave the text as the last letter of the text 
     // + the whole text minus the last character.
     text = text[text.length - 1] + text.substring(0, text.length - 1);
     
     // Show this new text
     textNode.data = text;
    }, 100);
}

// Let's run the function!
animate_string('idElement')

<div id="idElement">
  Lorem ipsum dolor sit amet
</div>

这个javascript程式码有什么作用？如何运作？

1 个答案: