if文を使った文字列比較

Question

if文を使った文字列比較

Jqueryでボタンを押したときニュースリストに新着ニュースを追加。
追加した新着ニュースがすでにある場合、追加をやめる。

発生している問題

文字列を比較するための文字列取得方法がわからず・・・(:;)
また、比較文もわからず・・・(:;)

該当のソースコード

<button id="button"> ボタン </button>

<!-- 新着ニュース -->
<ul class="List NewsList">
<li><span class="Time">10:43</span><a href="http://">aa</a></li>
<li><span class="Time">10:39</span><a href="http://">aaa</a></li>
<li><span class="Time">10:36</span><a href="http://">aaaa</a></li>

var $News='<li><span class="Time"></span><a href="https://">a</a></li>'
$(function(){
 $("#button").on("click",function(){
$(".NewsList").prepend($News);
});
});

宜しくお願いします・・・(:_;)

Answer 1

文字列を比較するための文字列取得方法がわからず

↑どの文字を取得/比較したいのか明示されてないので、この部分はスキップします。

また、比較文もわからず

↑普通に「==」で比べればよろし。

console.log("abc" == "abc"); // true
console.log("abc" == "def"); // false

Answer 2

新着ニュースの時刻も含めてチェックをされますでしょうか？
もし、時刻はチェックせず内容のみのチェックであるのであれば
下記のような方法で比較ができると思います。

var news = "追加したいニュースのテキスト";

$(function(){
    $("#button").on("click", function(){
        var target = $(".List.NewsList li a");
        var len    = $(target).length;
        var result = false;
        for (var i = 0; i < len; i++) {
            var obj = $(target).get(i);
            if ($(obj).html() === news) {
                result = true;
                break;
            }
        }

        if (result === true) {
           // 一致する内容があったときの処理
        }
    });
});

別のやり方としては、ul内の文字列を全て取得してきて
一致する文字があるかどうかだけを見る方法でしょうか。

var target = $(".List.NewsList").html();
var search = "検索したい文字列";

var result = target.indexOf(search) >= 0;

Answer 3

ほぼ答え

<script src="https://code.jquery.com/jquery-3.3.1.min.js" integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8=" crossorigin="anonymous"></script>


<button id="button"> ボタン </button>

<!-- 新着ニュース -->
<ul class="List NewsList">
    <li><span class="Time">10:43</span><a href="http://">aa</a></li>
    <li><span class="Time">10:39</span><a href="http://">aaa</a></li>
    <li><span class="Time">10:36</span><a href="http://">aaaa</a></li>
</ul>

    <script>
    // 追加する文字
    let $News='<span class="Time"></span><a href="https://">a</a>'

    // ページのロードが完了したときに実行される
    $(function(){
        // 「id="button"」の要素がクリックされたら
        $(document).on("click", '#button', function(){
            // すでにリストに追加されていたらtrueになる
            let flag = false;

            // ulリストの中身をすべて探索する
            $('ul.List li').each(function(){
                console.log($(this).html() + ' or ' + $News);
                if ($(this).html() === $News) {
                    // liの中身と追加したい文字列が一緒ならば
                    flag = true;
                }
            });

            // 追加
            if (flag === false) {
                $(".NewsList").prepend('<li>' + $News + '</li>');
            } else {
                alert('すでに追加されています');
            }

        });
    });
</script>

Comments

[rrrrrrr]

追加しようとするニュースのタイトルと同じものが既にあったら追加しない。という処理を教えていただけないでしょうか(:_;)！

Answer 4

id="button"を押したときにニュース情報を取得して、class="NewsList"内の記事タイトルと同じものがあるかどうかを比較。
という流れだと思いますが、どのような形式でニュース情報を取得してくるのかといった情報が足りないため、現状では正確なアドバイスができない状態かと思います。

また、比較の際は厳密比較(===)の方がより正確ですね。