2

我有一个 ID 为“headercontent”的 div,我有一个脚本,如果在用户系统上启用了 javascript,我将编写一个链接,但也有一个使用 noscript 的备份,以防用户没有启用 javascript。

代码运行良好,执行时写入了'a'元素,但问题是代码没有写入执行它的div中。它写在'headercontent'div之外,它完全忽略了类样式,即使它是用渲染代码编写的。我不太担心样式/类,因为我可以在元素中添加一个样式属性,并在必要时用 javascript 编写它,但我更关心为什么它在这个 div 之外编写代码。

我的代码是:

<div id="headercontent">
    hey, this is a div.
    <a href="#" class="button">This is a link</a>
    <a href="#" class="button">This is another link</a>

    <script type="text/javascript">
        writeask()
        function writeask() {
         var writeaskbox = document.createElement('a');
         writeaskbox.href = 'javascript:askbox()';
         writeaskbox.className = 'button';
         writeaskbox.innerHTML = 
             ['Ask'].join(' ')
         document.body.appendChild(writeaskbox);
        }

        function askbox(){
         var askbox = document.getElementById('askbox')
         if (askbox.style.display == 'none') {
          askbox.style.display = 'block'
          askbox.style.height = '150px'             
         } else {
          askbox.style.display = 'none'
          askbox.style.height = '0px'
         }
        }
    </script>
    <noscript><a href="/ask" class="button">Ask</a></noscript>
</div>

如何让 writeask() 函数在执行它的同一 div 中创建这个元素?所以最终的输出是:

<div id="headercontent">
    hey, this is a div.
    <a href="#" class="button">This is a link</a>
    <a href="#" class="button">This is another link</a>
    <a href="javascript: askbox()" class="button">Ask</a>
</div>

代替:

<div id="headercontent">
    hey, this is a div.
    <a href="#" class="button">This is a link</a>
    <a href="#" class="button">This is another link</a>
</div>
<a href="javascript: askbox()" class="button">Ask</a>

我仍然是 javascript 的初学者,所以我现在很困惑。如果有人可以提供帮助,那将不胜感激。

先感谢您。担。

4

3 回答 3

3

代替

document.body.appendChild(writeaskbox);

利用

document.getElementById("headercontent").appendChild(writeaskbox);
于 2012-02-02T23:31:55.330 回答
3

首先,您在函数存在之前调用 writeask(),因此在这种情况下,您应该以相反的方式执行此操作。它应该是:

function writeask() {}
function askbox(){}

writeask();

然后你将它附加到身体

document.body.appendChild(writeaskbox);

,而不是 div,因为它应该是

document.getElementById("headercontent").appendChild(writeaskbox);
于 2012-02-02T23:31:58.097 回答
2

代替

document.body.appendChild(writeaskbox);

您应该执行以下操作:

document.getElementById('headercontent').appendChild(writeaskbox);
于 2012-02-02T23:32:40.710 回答