Accesarea unor valori dintr-un arbore div cu Javascript

Aici postaţi orice este legat de tehnologiile "client side". HTML, HTML5, XHTML, CSS, CSS3, XML, Standarde
Manual JS: http://www.phpromania.net/jsmanual/index.html

Moderatori: eyecon, Moderatori

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Mie Ian 14, 2015 5:31 pm

Salutare tuturor,

Doresc sa accesez niste valori implementate adanc intr-un "ärbore" de div-uri, dupa care un table si iar un div. Problema este ca nu toate elementele au un id ca se le pot obtine cu getElementById.
Imagine

Mai jos aveti o poza cu organizzarea elementelor html pentru o locatie.
Imagine

Fiecare locatie are 2 div-uri:
- locatie-1-hd;
- locatie-1-bd;

Fiecare locatieX-bd are alte 2-3 divuri cu informatii de care am nevoie. La locatie1-bd intr-adevar apare beleaua.

Ma intereseaza sa pot obtine valorile din fiecare td avand in vedere faptul ca td-urile au mai departe cate un div implementat (si in anumite cazuri un img sau a

Spre exemplu pentru primul td din locatia 1 am luat valoarea pentru title asa:

Cod: Selectaţi tot

var title2 = $('#ext-gen15-gp-location-1 table img').attr('title');
      console.log("title2:" +title2);

Valoarea obtinuta este pentru primul div de dupa locatie-1-bd.

Ce fac pentru celelalte 2 div-uri? Banuiesc ca trebuie sa folosesc un array ceva.



Avatar utilizator
ispas
Senior Member
Mesaje: 655
Membru din: Mar Sep 14, 2010 1:35 pm
Localitate: Craiova
Contact:

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde ispas » Mie Ian 14, 2015 6:44 pm

Poti face un loop cu jquery.

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Mie Ian 14, 2015 7:18 pm

ispas scrie:Poti face un loop cu jquery.

In primul rand ma intereseaza sa gasesc sintaxa pentru a prelua valorile de dupa td-uri si dupa care sa integrez sintaxa intr-un loop.
Ai putea sa-mi dai un exemplu sa incerc sa testez la ce te-ai gandit?

Multumesc.

Avatar utilizator
Birkoff
Senior Member
Mesaje: 6380
Membru din: Joi Mar 18, 2004 2:34 pm
Localitate: Bucuresti
Contact:

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde Birkoff » Mie Ian 14, 2015 7:29 pm

vezi poate te ajuta api-ul lor sa iti extraga ce vrei de pe site si sa ti-l dea intr-o forma usoara de folosit https://import.io/

recomandarea mea e daca iei ceva de pe un site, bazeaza-te pe feed-ul rss sau pe api-ul oferit de ei (legal daca nu au le ceri si faci un contract cu ei pentru preluarea datelor) altfel poti tu avea probleme legate de preluarea datelor fara acordul lor (depinde cum au clauzele pe site-ul ala)
1) CMS, ERP, CRM, etc... (doar pentru clienti))
2) Portofoliu, servicii, contact, blog
3) Folositi aceasta clasa sql in proiectele voastre (open source)
4) Vrei un magazin virtual la cheie, usor de folosit, cu api-uri incluse pentru maximizarea vanzarilor si multe alte facilitati? Da un semn si discutam.

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Mie Ian 14, 2015 7:42 pm

Nu se pune problema de folosirea datelor fara acordul posesorului. Nu este un site in extern si din pacate nu am eu acces sa modific elementele html de care am nevoie astfel incat sa pe pot prelua.
Pe mine ma intereseaza sa extrag niste date de pe un portal cu acces intern pentru a le putea afisa sub forma de notificari ca sa nu stau mereu cu portalul in fata.

Avatar utilizator
ispas
Senior Member
Mesaje: 655
Membru din: Mar Sep 14, 2010 1:35 pm
Localitate: Craiova
Contact:

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde ispas » Mie Ian 14, 2015 9:04 pm

Nu prea am inteles bine ceea ce vrei tu. Te referi la toate valorile care sunt intr-un <td> sau cum?

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Mie Ian 14, 2015 11:51 pm

ispas scrie:Nu prea am inteles bine ceea ce vrei tu. Te referi la toate valorile care sunt intr-un <td> sau cum?

Salutare,

Structura table contine niste valori de care am nevoie:

Cod: Selectaţi tot

<table class="x-grid3-row-table">
  <tbody>
    <tr>
       <td>
          <div class="x-grid3-cell-inner x-grid3-col-0">
             <img .... title="No alarms">
          </div>
       </td>
       <td>
          <div class="x-grid3-cell-inner x-grid3-col-1">
             <a ...>
          </div>
       </td>
       <td>
          <div class="x-grid3-cell-inner x-grid3-col-2">Text</div>
       </td>
       <td>
          <div class="x-grid3-cell-inner x-grid3-col-2">Text</div>
       </td>
       ...
    </tr>
  </table>


Tabelul (in img2: <table class="x-grid3-row-table">) contine 6 td-uri iar fiecare td contine cate un div. In acest div sunt informatiile de care am nevoie cu exceptia primelor doua care contin la randul lor un element "img" si un element "a".
De la elementul "img" am avut nevoie de valoarea atributului "title" pe care am preluat-o asa:

Cod: Selectaţi tot

var title = $('#ext-gen15-gp-location-1 table img').attr('title');
      console.log("title:" +title);

...dar asa pot ajunge doar la primul element de tip img din primul tabel din location-1 si pe mine ma intereseaza aceasta valoare si din urmatoarele 2 tabele pentru aceeasi locatie "location-1".
Acest tabel este la randul lui intr-un div (in img2: <div class="x-grid3-row x-grid3-row-first">). Sunt 3 div-uri de acest gen celelalre 2 in imaginea 2 fiind <div class="x-grid3-row x-grid3-row-alt"> si <div class="x-grid3-row"> , ceea ce inseamna 3 tabele diferite pentru location-1-bd. Fix acelasi lucru se intampla pentru celelalte div-uri location-X-bd unde X=1..12.

Acum, intrebarea mea este cum ajung la valoarea fiecarui div din td pentru fiecare tabel din locatie-1-bd -> locatie12-bd.

Daca nu se poate creea un loop pentru fiecare td dintr-un tabel (pentru ca sunt clase diferite pe peste tot) sau un loop pentru div-urile de deasupra tabelelor inteleg....si atunci impart codurile pentru fiecare locatie si o sa iau valorile rand cu rand, nu-i problema. Tot ceea ce imi doresc este sa ajung la o sintaxa care sa functioneze pe codul de mai sus astfel incat sa obtin textul (div.innerHTML) din div-urile continute de td-uri sau macar sa imi exemplificati exact cum poate fi "parcurs" drumul pana la elementul dorit dupa care ma ocup eu de restul.

Ma gandesc la ceva gen

Cod: Selectaţi tot

var title = $('#ext-gen15-gp-location-1 table[0] td[0] img').attr('title');
var title = $('#ext-gen15-gp-location-1 table[0] td[1] div[0]').attr('innerHTML');
....
var title = $('#ext-gen15-gp-location-1 table[1] td[0] img').attr('title');
var title = $('#ext-gen15-gp-location-1 table[1] td[1] div[0]').attr('innerHTML');
...
var title = $('#ext-gen15-gp-location-9 table[0] td[0] img').attr('title');
var title = $('#ext-gen15-gp-location-9 table[0] td[1] div[0]').attr('innerHTML');
...
dar nu stiu exact sintaxa.

Sper sa fii inteles exact la ce ma refer.

Multumesc pentru intelegere si rabdare.

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Joi Ian 15, 2015 12:11 am

Ca sa fiu sincer, modul de functionare va fi urmatorul:
- verific fiecare atribut "title" pt fiecare element de tip "img" din fiecare tabel. Acesta este exprimat in primul td din tabel.
- daca este diferit de "No alarms" atunci o sa preiau informatiile din urmatoarele td-uri pentru a fi afisate intr-o notificare.
Cam asta este pe scurt ce vreau sa fac.

chrysstyann
PHPRomania Supporter
Mesaje: 16
Membru din: Vin Ian 14, 2011 8:27 pm

Re: Accesarea unor valori dintr-un arbore div cu Javascript

Mesajde chrysstyann » Joi Ian 29, 2015 6:30 pm

Salutare,

Am reusit sa administrez aceasta problema, acum m-ar interesa altceva daca se poate sa intreb in acelasi topic.

La fiecare 3 minute, tabelul principal se reincarca cu noile valori din baza de date. As vrea sa reinitiez functia care verifica valorile dupa ce se reincarca acest tabel. Din pacate nu se reincarca toata pagina, deci nu este un auto-refresh. La fiecare 3 minute doar continutul de sub div-ul cu id="ext-gen24" (unde se afla toate valorile) se reincarca. Cand se reincarca am urmatoarea situatie:

Pana sa se faca refresh arata asa:

Cod: Selectaţi tot

<div class="x-grid3-body" style="width: 1877px;" id="ext-gen24">
   <div id="ext-gen15-gp-location-AMSTERDAM5999" class="x-grid-group ">
   <div id="ext-gen15-gp-location-AUSTIN1" class="x-grid-group ">
   ....
</div>

In timpul refreshului arata asa:

Cod: Selectaţi tot

<div class="x-grid3-body" style="width: 1877px;" id="ext-gen24">...</div>

...deci toate elementele din interiorul divului "ext-gen24" devin "...".

Am incercat cu urmatorul cod sa execut din nou functia care face verificarea dar nu are efect:

Cod: Selectaţi tot

$( "#ext-gen24" ).load(function() {
  //code goes here
});

...am incercat si cu .ready.
La fel, am incercat sa verific cand se reincarca unul din div-urile din interiorul celui cu "ext-gen24" si la fel se intampla.

Cod: Selectaţi tot

$( "#ext-gen15-gp-location-AMSTERDAM5999" ).load(function() {
  //code goes here
});


Ma poate ajuta cineva cu aceasta situatie?

Multumesc.


Înapoi la “HTML/JavaScript/CSS”

Cine este conectat

Utilizatori ce ce navighează pe acest forum: Niciun utilizator înregistrat și 25 vizitatori