0

独自の To Do リスト アプリケーションを作成しようとしていますが、最初のステップがうまくいきません。これが私のコードです：

<!DOCTYPE html>
<html>
    <head>
        <title>To-Do List</title>
        <script type='text/javascript' src='script.js'></script>

    <!--JAVASCRIPT-->
    <script>
     </script>

        <script src="jquery.js"></script>

        <!--JQUERY--> 
<script>

$(function() {
  $("#new").click(function() {
     $("html").append("<div><form> Category Name: <input type = \"text\">")
    });
});

</script>
</head>

   <!--USER INTERFACE-->
   <div>
   <p id = "new">New Category</p>
   </div>

   <div><p>Customize</p></div>

   <div><p>Save this list</p></div>


    </body>
</html>

アプリケーションを Notepad++ (Chrome の最新バージョン) で開くと、[新しいカテゴリ] をクリックしても何も起こりません。何か助けはありますか？

4

3 に答える 3

3

div要素に aを追加していhtmlます：

$("html").append("<div><form> Category Name: <input type = \"text\">")

body要素内ではなく、またはその下に配置する必要がありhtmlます。

$("body").append("<div><form> Category Name: <input type = \"text\">")

とにかく表示されるブラウザもありますが、無効な構造を作成しています。div有効なものに固執するのがおそらく最善です。

(DOM を介してこれを作成することは、そのコンテンツを含む HTML ファイルを実際に作成することとはまったく異なることに注意してください。シリアル化された HTML には、ファイルや URL からのタグなど、「オプションの」タグがありますが、それは、ドム。）

追加するフラグメントに終了タグを含めることも、おそらく良い考えです。

$("body").append("<div><form> Category Name: <input type = \"text\"></form></div>")
// Here ------------------------------------------------------------^^^^^^^^^^^^^

...私の実験ではjQueryは気にしませんでしたが。

于 2013-08-14T20:59:54.400 に答える