前提・実現したいこと
【テキストが入っている要素のみ取得したい】
先日、こちらでテキストが入っている要素を取得する方法をご教授頂いたのですが、その方法だとテキストが入っている要素にbrタグが入っていたり、<p>テキスト<span>テキスト</span></p>のような要素の状態だと取得出来ないことに気づきました。
これらの問題を解決するために、childeren()で子要素を指定する時にnot()でbrタグを指定したら、brタグが入っている場合でも取得することが出来ました。
しかし、<外の要素>テキスト<中の要素>テキスト</中の要素></外の要素>のような場合はパターンが無限にあるのでnot()では対応出来ないことに気づきました...
他にいい方法等がありましたらぜひご教授下さい。。。
使用言語:jQuery バージョン1.11.2
ご教授頂いたソースコード
var getEleInText = $(".wrap *").filter(function(){ return $(this).text()!==""&&$(this).children().length==0; });
brを除外したソースコード
var getEleInText = $(".wrap *").filter(function(){ return $(this).text()!==""&&$(this).children().not("br").length==0; });
以下追記
・過去の質問 https://teratail.com/questions/111194
yambejp 様
下記のように、要素に複数のテキストが入っている場合、そのテキストごとに取得をし、
要素直下にテキストが入っていない場合、その要素は取得したくない と考えております。
<p>テキスト<!--取得したい--> <span>テキスト</span><!--取得したい--> </p> <dl><!--取得したくない--> <dt><!--取得したくない--> <h3>テキスト</h3><!--取得したい--> </dt> <dd><!--取得したくない--> <p>テキスト<!--取得したい--> <span>テキスト</span><!--取得したい--> </p> </dd> </dl>
kei344 様
最終的に「ブックマークレットでjsを実行してcssの記述を書き出す」の理由ですが、
コーディング時、psd等のカンプのテキストとフォントサイズやテキストカラーが合っているかの確認する作業の工数削減が最終的な目的です。
検証ツールで要素を一つづつ確認するのではなく、一気に確認出来るようにしたいと思っています。
回答3件
あなたの回答
tips
プレビュー