Java Script. input text içindeki kelimeleri sayma kontrol etme kullanılan kelime sayısına göre smile cıkarma ben burada resimleri proje içine koyduğum için sizde gözükmeyebilir burada image olan adları kendi resim adınıza göre cıkarınız.

<script type="text/javascript">

    function karaktersiniri() {
        var val = document.getElementById("metinBelgesi").value;

        var tt = val.split(' '); // boşlukları al
        var kesa = tt.length; // boşlukları say


        var kalankarakter = 100 - val.length;
        document.getElementById("sayac12").innerHTML = kesa;

        if (kalankarakter >= 0) {
          

            document.getElementById("sayac1").innerHTML = kalankarakter;


            if (kalankarakter <= 59) { //karakterleri kontrol edip ona göre resim cıkarıyoruz.
                document.getElementById("resimx").innerHTML = "<img src='image.png' height='50' width='50'/>";
                document.getElementById("sayac1").innerHTML = kalankarakter;
                if (kalankarakter <= 40) {
                    document.getElementById("resimx").innerHTML = "<img src='images1.png' height='50' width='50'/>";
                    document.getElementById("sayac1").innerHTML = kalankarakter;

                    if (kalankarakter <= 22) {
                        document.getElementById("resimx").innerHTML = "<img src='images2.png' height='50' width='50'/>";
                        if (kalankarakter <= 10) {
                            document.getElementById("resimx").innerHTML = "<img src='images.png' height='50' width='50'/>";

                        }
                    }
                }
            }
            
            }
        
    
    
        else {
            document.getElementById("resimx").innerHTML = "<img src='images3.png' height='50' width='50'/>";
                document.getElementById("metinBelgesi").value = document.getElementById("metinBelgesi").value.substring(0, 100); // burada ilk yuz karateri alım tekrar basıyoruz
            }
        }
    


</script>


<textarea id="metinBelgesi" onkeyup="karaktersiniri()" cols="20" rows="5"></textarea>
  

    <br/>
toplam kelime sayısı: <span id="sayac12"></span>
    <br/>

kalan karakter sayisi: <span id="sayac1">100</span>  
<div id="resimx"></div> 
    <br/>




  
<input id="buton" type="button" onclick="karaktersiniri()" value="Dene" />


<!----------------buradada  içindeki bir kelimeyi buluyoruz ----------------->
    <script type="text/javascript">
function kelime_Arama()
{
    var katar = document.getElementById("metinBelgesi").value;
    var aranacak = document.getElementById("ornekKelGiris").value;

    var sonuc = katar.indexOf(aranacak);

    if(sonuc == -1) {
        alert("\"" + aranacak + "\" kelimesi bulunamadı");
    }
    else{
        alert("\"" + aranacak + "\" kelimesi, katarın " + sonuc + ". konumunda bulundu.")
    }
}
    </script>

    <p>
       
    </p>
    <p>
        Aranacak Kelime :
        <input type="text" id="ornekKelGiris" placeholder="aranacak kelimeyi bul"/>

        <input type="button" value="Kelimenin Konumunu Göster" onClick="kelime_Arama()" />
    </p>