Schaltfläche hinzufügen, um eine HTML-Seite mit Javascript
Ich versuche, ändern Sie die HTML-markup einer Seite, um einige button mit JavaScript.
Unten finden Sie ein "snippet" (ziemlich lang, ich entschuldige mich, aber ich wirklich brauchen Sie, um die Struktur der Seite) die Seite, die ich bin versucht zu ändern.
Meine JavaScript-code eingefügt wird, indem eine browser-Erweiterung (die ich erfolgreich hinzufügen können Sie das JavaScript auf der Seite und es läuft) und die einzige operation, die Sie tun sollten, ist das hinzufügen einer Schaltfläche in die richtige position.
Die HTML-Seite enthält ein <FORM> mit einer Tabelle.
Nach einigen Zeilen und Zellen gibt es eine Zelle, die enthält 3-Eingang-Tasten:
<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.');">Möchte ich meinen JavaScript-code zu platzieren, eine vierte Schaltfläche ist nur nach den desel - Taste.
Dies ist der code, den ich verwenden Sie die Schaltfläche hinzufügen:
function add() {
var element = document.createElement("input");
element.setAttribute("type", "button");
element.setAttribute("value", "invert");
element.setAttribute("name", "button3");
element.setAttribute("onclick", "foo()");
document.flotta.appendChild(element);
}Dieser code offensichtlich Orte, die den Knopf gerade am Ende meines Dokuments, nur nach der form (benannt flotta).
Merkte ich, dass ich nicht verwenden Sie die Funktion getElementById weil die <td> tag, kurz bevor die Tasten nicht über eine id verbunden.
Daher Frage ich mich, ob jemand kann mir eine Lösung fügen Sie die vierte Taste in der richtigen Stelle.
<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*/"> </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"> </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>- Verwenden Sie nicht
setAttributezu set-Taste, Eigenschaften, Verwendung von direct-Eigenschaften verwenden, wieelement.type = "button";. Vor allem nicht, verwenden Sie diese syntax, um event-Handler zuweisen, verwenden Sie einfachelement.onclick = foo;(oder eines der standard-DOM-level-2-Funktionen). - warum nicht u verwenden jquery
- danke für deinen Tipp, aber meine Aufmerksamkeit ist mehr darauf gerichtet, wie um das Element in die richtige position. können Sie mir helfen?
Du musst angemeldet sein, um einen Kommentar abzugeben.
Den folgenden code erhalten, sollten die td:
Grundsätzlich, es kommt werden alle Felder/buttons mit den Namen 'desel' und, vorausgesetzt, es gibt nur einen, bekommt der Elternteil, der das erste element (das sollten die td, die enthält die Schaltflächen).