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

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

ただいまの
回答率

90.47%

  • PHP

    24519questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • JavaScript

    20939questions

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

  • HTML

    11853questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    8341questions

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

jqueryでdiv直下の要素をすべて取得したい

受付中

回答 2

投稿

  • 評価
  • クリップ 0
  • VIEW 5,634

samazama4623

score 81

   var content = $('#carrer_original').children("div,label").clone();
で取得すると余分なものがしゅとくできてしまいます
下のdiv全てを取得するのはどうすればよいですあk
 
    <div id="carrer_original" class="add_table" style="display: none;">
        <label class="col-sm-3 control-label form-profile-label" for="ask1">職種</label>
        <div class=" col-sm-9 form-profile-input-02 career-hide">

          <input class="form-control" type="text" placeholder="" value="" name="job_kind[]">
        </div>
        <label class="col-sm-3 control-label form-profile-label" for="ask1">会社名</label>
        <div class="col-sm-9 form-profile-input-02">
          <input type="text" class="form-control"   name="company_name" value="" placeholder="">
        </div>
        <label class="col-sm-3 control-label form-profile-label" for="ask1">在籍期間</label>
        <div id="term" class="col-sm-9 form-profile-input-02">
          <div class="row">
            <div class="col-sm-4">
              <select class="form-control col-sm-2" name="first_year">年
                {foreach from=$item_lists.year key=key item=year }
                {if $key == 1999}
                <option value="{$key}" selected>{$year}</option>
                {else}
                <option value="{$key}">{$year}</option>
                {/if}
                {/foreach}
              </select>
            </div>
            <div class="col-sm-2">
              <select class="form-control col-sm-3" name="first_month">月
                {foreach from=$item_lists.month key=key item=month }
                <option value="{$key}">{$month}</option>
                {/foreach}
              </select>
            </div>
          </div>

        <div>~</div>
        <div class="row">
          <div class="col-sm-4">
            <select class="form-control col-sm-2" name="last_year">年
              {foreach from=$item_lists.year key=key item=year }
              {if $key == 1999}
              <option value="{$key}" selected>{$year}</option>
              {else}
              <option value="{$key}">{$year}</option>
              {/if}
              {/foreach}
            </select>
          </div>
          <div class="col-sm-2">
            <select class="form-control col-sm-3" name="last_month">月
              {foreach from=$item_lists.month key=key item=month }
              <option value="{$key}">{$month}</option>
              {/foreach}
            </select>
          </div>
        </div>
        <div>
          <input class="btnJobAdd " type="button" value="追加" name="add">
        </div>
        </div>
      </div>
  • 気になる質問をクリップする

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

回答 2

0

div#carrer_originalの
子要素のdivを取得したいのでしたら
$('#carrer_original').children('div');
子孫要素を取得したいのでしたら
$('#carrer_original').find('div');

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

0

$('#carrer_original').children("div,label"); 
を実行すると、<div id="carrer_original">直下の<div>と<label>を取得しています。
なので、この段階で取得できている要素は下記とその中に含まれる要素です。
  • label.col-sm-3.control-label.form-profile-label
  • div.col-sm-9.form-profile-input-02.career-hide
  • label.col-sm-3.control-label.form-profile-label
  • div.col-sm-9.form-profile-input-02
  • label.col-sm-3.control-label.form-profile-label
  • div#term.col-sm-9.form-profile-input-02

1. 意図してdivとlabelを取得するように指定されていますので、余分なものとはどの要素を指すのでしょうか?
2. 下のdiv全てを取得するのはどうすればよいですあk  というのは下記でいうとどれでしょうか?
  A. div#carrer_original の中にある要素を全て取得したい。
  B. div#carrer_original の中にあるdiv要素を全て取得したい
  C. div#carrer_original そのものを取得したい。

A. の場合ですと、現状問題なくできてると思いますし、divとlabel以外のタグも入ってくる可能性があるのであれば指定を外せばよいでしょう。
$('#carrer_original').children();

B. の場合ですと、ichamさんの書かれている方法で可能です。

C. の場合で、clone();して使いたいということであれば
$('#carrer_original').clone();
で可能です。(そのままHTMLに入れると同じIDが複数になってしまうのでちょっとアレですが...)
文字列として取得したいのであれば、Firefoxも11からはouterHTMLが使えるようになってるようですので下記で取得することもできます
$('#carrer_original')[0].outerHTML;

参考
children([expr]) - jQuery 日本語リファレンス

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

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

  • ただいまの回答率 90.47%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

同じタグがついた質問を見る

  • PHP

    24519questions

    PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

  • JavaScript

    20939questions

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

  • HTML

    11853questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • jQuery

    8341questions

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