質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Q&A

解決済

2回答

2298閲覧

jQueryで、作成した要素自身のHTMLを取得する方法

miu_ras

総合スコア902

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

0グッド

0クリップ

投稿2017/07/27 04:04

jQueryで、作成した要素自身のHTMLを取得する方法を教えてください。

例えばこのように要素を作成して、

javascript

1var $a = $("<a>").text("寺尾").prop("href", "https://teratail.com").wrapInner("<b>"); 2console.log($a.html());

<a href="https://teratail.com"><b>寺尾</b></a>

こういう文字列を得たいと思っています。はい、文字列を得たいのです。
しかし上記を実行すると、以下の結果になります。

<b>寺尾</b>

一応、以下のようにダミーの親要素を作成してその下に作成すれば期待する結果は得られました。

javascript

1var $div = $("<div>").append($a); 2console.log($div.html());

ただ、できれば不要な要素は作りたくないと思っています。それに自身のHTMLを取得する機能くらいあってもいいのではないかと思っています。ただ、リファレンスをざっと見たのですが見つかりませんでした。

  • jQueryで要素自身のHTMLを取得する方法はありますか?
  • 無い場合、代替方法としてダミーの親要素を作成する方法以外にいい方法はありますか?

この点について教えてください。
よろしくお願いします。

※方法がない場合には「ない」という回答をしていただけたらあきらめがつきますのでありがたいです。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

DOMに.outerHTMLがありますので、それを使いましょう(MDN)。$a[0]としているのは、「jQueryオブジェクトの中から、0番目(先頭)のDOM要素を得る」という意味です。

javascript

1var $a = $("<a>").text("寺尾").prop("href", "https://teratail.com").wrapInner("<b>"); 2console.log($a[0].outerHTML);

投稿2017/07/27 04:10

maisumakun

総合スコア145121

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miu_ras

2017/07/27 04:30

そう。「outerHTMLみたいなのないかな、それくらいあるだろ」と思って質問をしました。でもjQueryのメソッドには無いという事なんですかね。 そうか。ないなら取り出してしまえばいいのですね。なるほど。そういう使い方をあまりしたことがなかったので思いつきませんでした。ブラウザの対応的にも、現在なら問題なさそうですしね。 参考になりました。ありがとうございました
guest

0

ベストアンサー

maisumakunさんの回答で問題ないかとは思いますが
せっかくなのでpropから参照したほうがよいかもしれません

javascript

1 console.log($("<a>").text("寺尾").attr("href", "https://teratail.com").wrapInner("<b>").prop('outerHTML')); 2

hrefはpropよりattrのような気がします(自信なし)

投稿2017/07/27 04:30

yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miu_ras

2017/07/27 04:38

おお。これなら、DOMを取り出さずにjQueryの世界だけで完結していますね。面白いですね。 参考になりました。ありがとうございました ※hrefは確かに、attrの方が自然な気がしますね。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問