0

我正在尝试编写一个简单的脚本。

这是想法：

我有一个 div 元素并在 div 中动态创建了段落元素。段落元素包含一些文本。我在页面上也有一个链接。单击链接时，我希望将文本更改为其他文本（预定义）。我有 2 个功能：一个用于创建段落元素并将其附加到 div 的功能。第二个功能是更改文本。我相信这个问题与将变量从一个函数传递到另一个函数有关

这是HTML：

<a href='' onclick='changeText();return false;'>Change Text</a>

    <div id='box'></div>

这是JS代码：

var x = document.getElementById('box');

        window.onload = function createEl(){

            var p = document.getElementsByTagName('div')[0];
            var el = document.createElement('p');

                var text = "Hello";
                p.appendChild(el);
                var res = document.createTextNode(text);
                el.appendChild(res);
}


function changeText(){

    text.innerHTML = 'other text';


}
4

1 回答 1

0

你猜对了。但是，我没有修复脚本中的错误（因为您犯了几个初学者错误），而是稍微重写了它并解释了每件事的作用。这是您的脚本应该可以工作的版本：

// we define these variables outside of any functions
// this means they're global and any function can get
// access to them.
var box_div, el;

window.onload = function createEl() {
    // get references to div element
    box_div = document.getElementById('box');

    // create a new <p> element and store it in 'el'
    el = document.createElement('p');

    // add text to the new <p> element
    el.appendChild(document.createTextNode("Hello"));

    // append the new <p> element to the div
    box_div.appendChild(el);
}

function changeText() {
    // since we have a reference to the <p> element
    // already, we can just do this:
    el.innerHTML = 'other text';
}​
于 2012-05-10T13:35:38.420 回答