javascript - すべてのテキストエリアタグを繰り返し処理し、それらの後にノードを追加する方法は?

Question

私は jquery 開発者ではなく、javascript 開発者でもありません。生活をシンプルにする簡単なハックを試しています。これはページです：

私が達成しようとしているのは次のとおりです。

1. ページの各要素のdiv後に mathjax_preview クラスを追加したいと思います。textarea
2. その div の inner.HTML は、対応するtextarea

しかし、うまくいかないようです。

次の JavaScript コードがjs/1.jsあり、ページの読み込み時に読み込まれます。

var preview_number = 0;
$("textarea").each(function() { 
    var d = $(this).next();
    if (!d.hasClass("mathjax_preview")) {
      preview_number++;
      var d = $("<div class='mathjax_preview' " +
         "style='padding: 5px; color: black; background: #eee; border: 1px solid #888;float:left;'" +
         "></div>");
      d.attr("id", "mathjax_preview_" + preview_number);
      d.insertAfter(this);
    } 
    d.text($(this).val());
    MathJax.Hub.Queue([ "Typeset", MathJax.Hub, d.attr("id") ]);
});

編集：

上記のファイルの先頭に次のスニペットを挿入しました。

var preview_number = 0;
var elements = document.getElementsByTagName("textarea");
  alert(elements.length);

その警告0。どうして？

Answer 1

次のことを試してください（頭のてっぺんからまっすぐなので、これはテストしていません）：

$(document).ready(function() {
    var preview_number = 0;

    $("textarea").each(function() { 
        preview_number++;

        var d = document.createElement("div");
        $(d).attr("id", "mathjax_preview_" + preview_number);
        $(d).addClass("mathjax_preview");
        $(d).css("padding", "5px");
        $(d).css("color", "black");
        $(d).css("background", "#eee");
        $(d).css("border", "1px solid #888");
        $(d).css("float", "left");
        $(d).html($(this).val());

        MathJax.Hub.Queue([ "Typeset", MathJax.Hub, $(d).attr("id") ]);

        $(this).append(d);
    });
});

Answer 2

ページの最後にjavascriptファイルを配置していないか、readyコールバックを使用していないため、アラートメッセージにゼロが表示されます。レディコールバックを使用するには、次のようにコードを追加します

$（document）.ready（function（）{/*ここにJavaScriptコードを追加*/}）;

Answer 3

変数textareaが存在しません。this代わりに使用してください:

d.insertAfter(this);

Answer 4

textarea変数が定義されていません。

d.insertAfter(textarea);

参考にしていただけると思います$(this)。

d.insertAfter($(this));

Answer 5

何がtextarea入っていd.insertAfter(textarea);ますか?

らしいd.insertAfter($(this));。