Js - Jquery - belirtilen classlar içindeki değerleri almak?

29-10-2021, 18:02:52

örneğin sayfada anlık olarak aşağıdaki span etiketleri arasında değerlerim olsun. span sayısı sayfada anlık değişiyor.
Veri 1
Veri 2
Veri 3
Veri 4

Bir taraftan span sayısı değiştikçe arttıkça azaldıkça anlık olarak .test classına sahip tüm spanların içindeki değerleri alıp dizi haline getirmek istiyorum.
Yani sonuç
Veri1, Veri2, Veri3, Veri4 gibi...

29-10-2021, 18:15:14

#2

Anathory

const data = [];
const spans = document.querySelectorAll('.text');

spans.forEach(span => {
data.push(span.innerHTML);
});

-------

Önce boş bir değişken oluşturduk, ikinci satırda tüm .text elementlerini seçtik. Ardından bu değeri forEach ile saydırarak .innerHTML ile içlerindeki yazıyı çekerek data'ya ekledik.

29-10-2021, 18:44:27

#3

buddy

Anathory adlı üyeden alıntı: mesajı görüntüle

const data = [];
const spans = document.querySelectorAll('.text');

spans.forEach(span => {
data.push(span.innerHTML);
});

-------

Önce boş bir değişken oluşturduk, ikinci satırda tüm .text elementlerini seçtik. Ardından bu değeri forEach ile saydırarak .innerHTML ile içlerindeki yazıyı çekerek data'ya ekledik.

teşekkürler hocam kullandım çalıştı ama .html yerine .text kullanmama rağmen span içinde eğer html etiketleri varsa onlarla beraber alıyor. bir de bunu sayfadaki anlık span sayısı değişince otomatik olarak aldığımız sonucun değişmesini nasıl sağlayabilirim?

29-10-2021, 19:01:41

#4

Misafir

buddy adlı üyeden alıntı: mesajı görüntüle

örneğin sayfada anlık olarak aşağıdaki span etiketleri arasında değerlerim olsun. span sayısı sayfada anlık değişiyor.
Veri 1
Veri 2
Veri 3
Veri 4

Bir taraftan span sayısı değiştikçe arttıkça azaldıkça anlık olarak .test classına sahip tüm spanların içindeki değerleri alıp dizi haline getirmek istiyorum.
Yani sonuç
Veri1, Veri2, Veri3, Veri4 gibi...

    <span class="test">Veri 1</span>
    <span class="test">Veri 2</span>
    <span class="test">Veri 3</span>
    <span class="test">Veri 4</span>

    <script>
        var data = [];
        setInterval(() => {
            var veri = document.querySelectorAll('.test')
            var json = {};
            for (let i = 0; i < veri.length ; i++) {
               json[`veri-${i}`]=veri[i].textContent;
            }
            data.push(json);
            console.log(data)
        }, 1500);
    </script>

Full

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <span class="test">Veri 1</span>
    <span class="test">Veri 2</span>
    <span class="test">Veri 3</span>
    <span class="test">Veri 4</span>


    <script>
        var data = [];
        setInterval(() => {
            var veri = document.querySelectorAll('.test')
            var json = {};
            for (let i = 0; i < veri.length ; i++) {
               json[`veri-${i}`]=veri[i].textContent;
            }
            data.push(json);
            console.log(data)
        }, 1500);
    </script>
</body>

</html>

buddy bunu beğendi.

1 kişi bunu beğendi.

29-10-2021, 19:08:11

#5

buddy

Misafir adlı üyeden alıntı: mesajı görüntüle

    <span class="test">Veri 1</span>
    <span class="test">Veri 2</span>
    <span class="test">Veri 3</span>
    <span class="test">Veri 4</span>

    <script>
        var data = [];
        setInterval(() => {
            var veri = document.querySelectorAll('.test')
            var json = {};
            for (let i = 0; i < veri.length ; i++) {
               json[`veri-${i}`]=veri[i].textContent;
            }
            data.push(json);
            console.log(data)
        }, 1500);
    </script>

Full

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <span class="test">Veri 1</span>
    <span class="test">Veri 2</span>
    <span class="test">Veri 3</span>
    <span class="test">Veri 4</span>


    <script>
        var data = [];
        setInterval(() => {
            var veri = document.querySelectorAll('.test')
            var json = {};
            for (let i = 0; i < veri.length ; i++) {
               json[`veri-${i}`]=veri[i].textContent;
            }
            data.push(json);
            console.log(data)
        }, 1500);
    </script>
</body>

</html>

hocam hoşgeldin bir süredir görünmüyorsun

console loga baktığımda sonuçları json olarak veriyor sanırım ama süre neden verdin hocam? sürekli arka arkaya data gönderiyor.

29-10-2021, 19:09:32

#6

Misafir

buddy adlı üyeden alıntı: mesajı görüntüle

hocam hoşgeldin bir süredir görünmüyorsun

console loga baktığımda sonuçları json olarak veriyor sanırım ama süre neden verdin hocam? sürekli arka arkaya data gönderiyor.

Hoş buldum hocam vakit kalmıyor

siz sürekli dediğiniz için belirli saniyede bir sayfayı kontrol etmesini istedim. İstediğiniz farklı bir şey miydi? Galiba dpan sayısı değişince istiyordunuz

buddy bunu beğendi.

1 kişi bunu beğendi.

29-10-2021, 19:11:04

#7

buddy

Misafir adlı üyeden alıntı: mesajı görüntüle

Hoş buldum hocam vakit kalmıyor

siz sürekli dediğiniz için belirli saniyede bir sayfayı kontrol etmesini istedim. İstediğiniz farklı bir şey miydi

console log böyle görünüyor bu şekilde problem yaratır mı sayfa uzun süre aktif kaldığında?

29-10-2021, 19:13:19

#8

Misafir

buddy adlı üyeden alıntı: mesajı görüntüle

console log böyle görünüyor bu şekilde problem yaratır mı sayfa uzun süre aktif kaldığında?

Hocam her seferinde dizinin yeni halini gösteriyor. Yazdırmaya gerek olmayacaktır ancak çok fazla json biriktiğinde fan ses çıkarmaya başlayabilir. Eğer o clada sahip öğe sayısı değiştiğinde json kaydetmek isterseniz çok daha hafif olur.

29-10-2021, 19:17:53

#9

buddy

Misafir adlı üyeden alıntı: mesajı görüntüle

Hocam her seferinde dizinin yeni halini gösteriyor. Yazdırmaya gerek olmayacaktır ancak çok fazla json biriktiğinde fan ses çıkarmaya başlayabilir. Eğer o clada sahip öğe sayısı değiştiğinde json kaydetmek isterseniz çok daha hafif olur.

Aynen hocam. hani sayfadaki .test classına sahip spanlar kullanıcı tarafından jquery ile anlık sayısı artıyor yada azalıyor demiştim ya. belirttiğimiz etikete sahip span sayısında değişiklik olduğunda sonucu verse harika olurdu. bir de span içinde başka span olursa onu elage etmek görmezden gelmekmümkünmüdür hocam?
Veri1 altveri