Fatal编程技术网
  • javascript/
  • 使用Javascript将按钮添加到HTML页面

使用Javascript将按钮添加到HTML页面

javascript html dom

使用Javascript将按钮添加到HTML页面,javascript,html,dom,Javascript,Html,Dom,我试图修改页面的HTML标记，以便使用JavaScript添加一些按钮 下面你可以找到我试图修改的页面的“片段”（很长，我很抱歉，但我真的需要你了解页面的结构） 我的JavaScript代码由浏览器扩展插入（我可以成功地将JavaScript添加到页面并使其运行），它应该做的唯一操作是在正确的位置添加一个按钮 HTML页面包含一个带有表的。 在一些行和单元格之后，有一个包含3个输入按钮的单元格： <input type="submit" name="submit" value="Set S

我试图修改页面的HTML标记，以便使用JavaScript添加一些按钮

下面你可以找到我试图修改的页面的“片段”（很长，我很抱歉，但我真的需要你了解页面的结构）

我的JavaScript代码由浏览器扩展插入（我可以成功地将JavaScript添加到页面并使其运行），它应该做的唯一操作是在正确的位置添加一个按钮

HTML页面包含一个带有表的
。
在一些行和单元格之后，有一个包含3个输入按钮的单元格：

<input type="submit" name="submit" value="Set Ships">
<input type="button" name="sel" value="Select all" onclick="alert('Not Allowed.');">
<input type="button" name="desel" value="Deselect all" onclick="alert('Not Alloowed.');">
这段代码显然将按钮直接放在我的文档的末尾，就在表单的后面（名为
flotta
）

我意识到我不能使用函数
getElementById
，因为按钮前面的
标记没有关联的
id

因此，我问是否有人能给我一个解决方案，将第四个按钮添加到正确的位置

<html>
    <head>
    <title>fee foo</title>  
        . . . head code
    </head>

<body >
    <div id="Layer" name="Layer" /*other attributes*/"></div>
    <table /*table attributes*/>
    . . . table content
    </table>
<form id="flotta" name="flotta" method="post" action="home.php?sel=gestioneflotta">
    <table /*table attributes*/>
        <tbody>
            <tr><td>
            <table /* attributes*/>
                <tbody><tr>
                <td /* attributes*/></td>
                <td /* attributes*/></td>
                <td /* attributes*/></td>
                </tr>
                <tr>
                <td /* attributes*/">&nbsp;</td>
                <td bgcolor="ffffff" background="bg/pergamena.jpg" align="center">
                <input type="submit" name="submit" value="Set Ships">
                <input type="button" name="sel" value="Select all" onclick="alert('Not Allowed.');">
                <input type="button" name="desel" value="Deselect all" onclick="alert('Not Alloowed.');">   </td>
                <td background="bg/menu_d.gif">&nbsp;</td>
                </tr>
                <tr>
                <td /* attributes*/" width="11" height="11"></td>
                <td /* attributes*/></td>
                <td /* attributes*/></td>
            </tr>
            </tbody>
            </table>
        </td></tr>
            <tr>
            . . . another row
            </tr>

        </tbody>
    </table>
</form>
<table border="0" cellspacing="0" cellpadding="0" align=center  width=510>
    . . . another table
</table>

<script type="text/javascript">
some script
</script>
</body>

</html>


费福
. . . 头号代码

以下代码应获得td：


var td = document.getElementsByName('desel')[0].parentNode;



基本上，它获取所有名为“desel”的字段/按钮，并假设只有一个，获取第一个元素的父元素（应该是包含按钮的td）。
不要使用
setAttribute
设置按钮属性；改用直接属性，如
element.type=“button”。尤其不要使用该语法来分配事件处理程序，只需使用
element.onclick=foo（或标准DOM level 2函数之一）。@marcel感谢您的提示，但我的注意力更集中于如何将项目放置在正确的位置。你能帮忙吗？

var td = document.getElementsByName('desel')[0].parentNode;