###前提・実現したいこと
jQueryで要素内に文字列が含まれているかどうかを取得し、含まれている要素のみ特定の処理（cssの書き換え等）を行いたい。

###発生している問題
文字列を検索する方法を調べたら、indexOfやmatch、search、testメゾットを使うと出てきたのですが、それらを使った記事はどれも「指定した文字列を検索して取得する」という内容で、
自分が実現したいのはあくまで「文字列の有無（テキスト内容はなんでもよくて、テキストが要素の中に入っているかどうか）」を取得したいのです。
その方法がどうしてもわからなくて困っています。ぜひご教授お願い致します。

namnium1125

2018/01/09 10:07 編集

検索対象.indexOf(特定文字列) != -1ではダメということでしょうか？追記:「任意の」文字列という意味ですね。ごめんなさい私の国語力不足でした。

行動規範の内容に同意します

回答4件

ベストアンサー

ざっくりでよいならtextのlength>0をチェックすればよいのでは？

javascript
1$(function(){
2  console.log($('#hoge').text().length);
3});

HTML
1<div id="hoge">aaa<span>bbb</span>ccc</div>

ただし、改行マークやタブなどもカウントされます

追記

よくみたらピックアップしてCSSを書き換えるんでしたっけ。
であればこんな感じで。

CSS
1div{width:100px;height:20px; background-Color:yellow}

javascript
1$(function(){
2  $('div').filter(function(){
3    return $(this).text().length>0;
4  }).css({'background-Color':'red'});
5});

HTML
1<div>aaa</div>
2<div>aaa<span>bbb</span>ccc</div>
3<div></div>

投稿2018/01/09 09:55

編集2018/01/09 10:17

yambejp

総合スコア114833

退会済みユーザー

2018/01/09 11:50

文字列検索でどうにかすることばかり考えてて、文字数で判断するのは全く思いつきませんでした...ありがとうございました！

行動規範の内容に同意します

以下のような形でスペースや空改行やコメント、子要素も含まないというのであれば、擬似クラス:emptyを利用する手もあります。

html
1<div></div>
2<div>ほげ</div>
3
4<div>
5</div><!-- 空改行が入ってるのでNG -->

css
1div {
2background-color: #f00;
3}
4
5div:empty {
6display: none;
7}

https://jsfiddle.net/takmatz/arzk7vq8/

投稿2018/01/09 10:12

退会済みユーザー

総合スコア0

こういうことがしたいのでしょうか？
filterを使って、文字列が含まれているアイテムのみを抜き出して操作を行っています。

html
1<html>
2<head>
3<style>
4div { width: 100px; height: 100px; border: solid 1px black; }
5</style>
6<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
7<script>
8$(function() {
9  $("div").filter(function() { return $(this).text() !== ""; }).css("background-color", "red");
10  console.log("ok");
11});
12</script>
13</head>
14<body>
15<div>text</div>
16<div>text</div>
17<div></div>
18<div>text</div>
19<div></div>
20<div>text</div>
21</body>
22</html>