jQuery｜要素だけを変更できますか？

質問

こんにちは、
現在、jQueryを勉強中なのですが、要素だけを変更することは可能なのでしょうか？例えば以下の＜h1＞タグを＜h2＞に変えたい、といった具合です。

<h1> wanna replace heading 1 with heading 2 </h1>

.htmlも.replaceWithも、テキストの内容ごと変えてしまうので、「要素だけ」を変更することができません。何か大きな勘違いをしていましたら、ご指摘いただければ幸いです。よろしくお願いします。

回答No.2

noname#140045 · ベストアンサー

チョット、確認していないのでハッキリとわかりませんが、
<h1>テキスト</h1>
の「テキスト」部分は
$("h1").text()
で、取得できますので
.repladeWith()
と、組み合わせて
$("h1").replaceWith("<h2>"+$("h1").text+"</h2>")
みたいにして、できないでしょうか。

お礼

お礼が遅くなってしまってごめんなさい。
実際に試してみましたが、ばっちり機能しました。そしてこれが一番スマートですね。使わせていただきます。
ありがとうございました！

回答No.4

my--

>>No.3

　$.fn.myMethod = function(arg) {
　　return this.replaceWith($(arg).text(this.text()));
　};

これにはバグがありますね。ゴメンなさい。

お礼

ありがとうございました！

回答No.3

my--

(function($) {
　$.fn.myMethod = function(arg) {
　　return this.replaceWith($(arg).text(this.text()));
　};
})(jQuery);

$('h1').myMethod('<h2 />');

プラグインを眺めてると、こんな感じで拡張されていますよね。

(function($) {
　$.fn.extend({
　　method1: function() {
　　　...
　　　return this;
　　},
　　method2: function() {
　　　...
　　　return this;
　　}
　});
})(jQuery);

オレオレ的なメソッドの公開なら、extendでまとめとけばよいかも。

お礼

お礼が遅くなってしまってごめんなさい。
自分で命令を作っちゃうってことですよね？ハードル高いですけど、本当に必要に迫られたときにはチャレンジしてみようと思います。ありがとうございました！

回答No.1

fujillin

jqueryはよく知りませんが、
現在の内容を入れ直してあげるとかではダメでしょうか？

$("h1").each(function(){
　$(this).replaceWith("<h2>" + $(this).html() + "</h2>");
});

お礼

ご回答ありがとうございます。
それなら可能です。ただ要素の入れ替えというのは、1番はじめに覚える命令としてあっても良さそうなので・・当方の勝手な思い込みかもしれないですね・・。使いそうで使わない気もしますし。ありがとうございました。

補足

ちなみに、今のところ一番簡潔なのは、<h2>で「wrap」してから、「remove」で<h1>を消す、という方法でしょうか。