Curs Javascript

In aceasta pagina e prezentata o clasa ce poate fi utilizata in JavaScript pentru impartirea /separarea unui sir alfanumeric (un sir cu mai multe sub-siruri de forma: "Nume Numar", separate printr-un anumit caracter).
Aceasta clasa contine o metoda ce separa "Nume" de "Numar" si le adauga separat intr-un obiect cu doua array-uri, in ordinea lor din sir.
- Vedeti exemplele si comentariile din cod.

Codul clasei

// clasa pt impartire sir Alfanumeric, de la: https://marplo.net/javascript/
function splitStr() {
  /*
 - $str = sirul alfanumeric,
 - $dlm1 = caracterul ce separa Nume de Numar
 - $dlm2 = caracterul ce separa perechile de sub-siruri: "Nume Numar"

 Un sir in felul acesta:
     "Nume[$dlm1]Numar[$dlm2]Nume[$dlm1]Numar"
  - caracterele de separare ($dlm1, si $dlm2) pot fi orice caracter, de exemplu: spatiu, liniuta, punct, virgula, etc.
 Aceasta metoda returneaza un obiect cu 2 array ('name' si 'num'), cu Nume si Numar din $str separate, in ordinea lor din sir
  */
  this.splitNameNumber = function(str, dlm1, dlm2) {
    // JavaScript-jQuery course: https://marplo.net/javascript/
  // si cu caractere ce trebuie escapate (cu '\') in RegExp
    var chrs = '.()[]<>?\'^*-+\\/';
    if(chrs.indexOf(dlm1) != -1) dlm1 = '\\'+dlm1;
    if(chrs.indexOf(dlm2) != -1) dlm2 = '\\'+dlm2;

    // seteaza sablonul RegExp folosit pt separare Nume, Numar si sub-siruri
    var patt1 = new RegExp('([a-z \\._\\-'+ dlm1 + dlm2+ ']+[0-9]+)', 'ig');
    var patt2 = new RegExp('([a-z \\._\\-'+ dlm1+ ']+)([0-9]+)', 'ig');

    var substr = str.split(patt1);          // array cu sub-siruri

    if(substr != null && substr != '') {
      var re = {"name":[], "num":[]};           // variabila pt datele care vor fi returnate
      var ir = 0;               // pt definire index elemente in re
      nrsubstr = substr.length;      // number of matched substrings

    // parcurge sub-sirurile gasite
      for(i=0; i<nrsubstr; i++) {
        // daca nu e gol
        if(substr[i] != '') {
          var name_num = substr[i].split(patt2);       // array cu Nume si Numar separate din sub-sirul curent

          // adauga Nume si Numar separate in array-urile din obiectul din re
          if(name_num != '') {
            re['name'][ir] = trim(trim(name_num[1], dlm1));
            re['num'][ir] = name_num[2];
            ir++;
          }
        }
      }

      return re;
    }
    else return false;
  }

  // functie pt stergere anumite caractere de la inceputul si sfarsitul unui sir
  var trim = function(str, chr) {
    var rgxtrim = (!chr) ? new RegExp('^\\s+|\\s+$', 'g') : new RegExp('^'+chr+'+|'+chr+'+$', 'g');
    return str.replace(rgxtrim, '');
  }
}
Ca sa folositi aceasta clasa, trebuie mai intai creat un obiect la ea, cu sintaxa:
var numeObiect = new splitStr();
Apoi se acceseaza metoda splitNameNumber(), transferand la argumente sirul si caracterele de delimitare
var obNameNums = numeObiect.splitNameNumber(str, dlm1, dlm2);

• Iata un exemplu practic de utilizare a acestei clase.
In acest exemplu se foloseste metoda splitNameNumber() pentru a separa Nume si Numar din sirurile adaugate in trei DIV-uri. Cand se apasa clic pe un buton cu eveniment onclick asociat cu un DIV, este creat si afisat un tabel HTML cu Numele si Numerele din acel DIV.
- Ca sa fie preluat sirul, creat si afisat tabelul HTML, este definita o alta functie care foloseste obiectul cu array-urile returnate de metoda splitNameNumber() a clasei "splitStr".
// Sirul-1 cu Nume si Numar separate prin punct '.', si sub-sirurile separate prin virgula ','
<div id="exstr1" style="margin:0 0 1em 3em;color:blue;">Curs JavaScript-jQuery.2013, CoursesWeb.net.2011, MarPlo.net.2009</div>
// Sirul-2 cu Nume si Numar separate prin spatiu, si sub-sirurile separate prin virgula ','
<div id="exstr2" style="margin:0 0 1em 3em;color:#00cb01;">Code Snippets 12, Cod JavaScript 2011, MarPlo.net Courses 2009</div>
// Sirul-3 cu Nume si Numar, si sub-sirurile separate prin spatiu
<div id="exstr3" style="margin:0 0 1em 3em;color:blue;">Tutoriale PHP_MySQL 23 Lectii Ajax 9 Web Development 2013</div>
<button id="exbtn1">Sirul-1</button> - <button id="exbtn2">Sirul-2</button> - <button id="exbtn3">Sirul-3</button>
<div id="tbstr">Aici e afisat tabelul cu Nume si Numar din siruri.</div>

<script type="text/javascript">
// AICI se adauga clasa splitStr


// primeste ID-ul  elementului HTML cu sirul, si caracterele ce imart Nume-Numar si sub-siruri
// creaza si afiseaza un tabel HTML
function reTable(idstr, dlm1, dlm2) {
  // preia sirul
  var str = document.getElementById(idstr).innerHTML;

  // creaza un obiect cu clasa splitStr si foloseste metoda splitNameNumber()
  var obSplitStr = new splitStr();
  var split_str = obSplitStr.splitNameNumber(str, dlm1, dlm2);

  var nrcol = split_str['name'].length;
  var htmltb = '<table cellpadding="2" cellspacing="0" border="1" style="margin:1em auto;border-color:#0001da;"><caption><b>'+idstr+'</b></caption><tr><th>Nume</th><th>Numar</th></tr>';

  // adauga datele din array-urile din split_str in tabelul HTML
  for(var i=0; i<nrcol; i++) {
    htmltb += '<tr><td>'+ split_str['name'][i] +'</td><td>'+ split_str['num'][i] +'</td></tr>';
  }

  // adauga tabelul HTML in elementul cu id="tbstr"
  document.getElementById('tbstr').innerHTML = htmltb +'</table>';
}

// inregistreaza eveniment onclick la cele 3 butoane
document.getElementById('exbtn1').onclick = function() { reTable('exstr1', '.', ','); }
document.getElementById('exbtn2').onclick = function() { reTable('exstr2', ' ', ','); }
document.getElementById('exbtn3').onclick = function() { reTable('exstr3', ' ', ' '); }
</script>
Ca sa vedeti rezultatul, clic pe butoanele de mai jos.
// Sirul-1 cu Nume si Numar separate prin punct '.', si sub-sirurile separate prin virgula ','
Curs JavaScript-jQuery.2013, CoursesWeb.net.2011, MarPlo.net.2009
// Sirul-2 cu Nume si Numar separate prin spatiu, si sub-sirurile separate prin virgula ','
Code Snippets 12, Cod JavaScript 2011, MarPlo.net Courses 2009
// Sirul-3 cu Nume si Numar, si sub-sirurile separate prin spatiu
Tutoriale PHP_MySQL 23 Lectii Ajax 9 Web Development 2013
- -
Aici e afisat tabelul cu Nume si Numar din siruri.

Un Test simplu in fiecare zi

HTML
CSS
JavaScript
PHP-MySQL
Engleza
Spaniola
Care tag HTML5 adauga o aplicatie externa (SWF, PDF) in pagina web?
<mark> <embed> <canvas>
<embed src="flash_game.swf" width="450" height="350" />
Ce pseudo-element adauga un anume stil la prima linie de text din element?
:first-letter :before :first-line
#id:first-line {
  font-weight: bold;
  color: blue;
}
Clic pe proprietatea obiectului window care preia sau seteaza adresa URL a paginii curente.
window.location window.self window.status
var url = window.location;
alert(url);
Indicati functia PHP care preia continutul unui fisier sau pagina si-l adauga intr-un sir.
fopen() file_put_contents() file_get_contents()
$homepage = file_get_contents("http://www.marplo.net/");
echo $homepage;
Care din urmatoarele perechi de numere sunt in ordine unul dupa altu?
seven - eight ten - six three - five
This fruit has seven or eight seeds.
- Acest fruct are sapte sau opt seminte.
Care din urmatoarele perechi de numere sunt in ordine unul dupa altu?
diez - seis siete - ocho tres - cinco
Esta fruta tiene siete u ocho semillas.
- Acest fruct are sapte sau opt seminte.
Impartire Sir Alfanumeric in Array

Last accessed pages

  1. Notiuni fundamentale despre bazele de date SQL (9654)
  2. Butoane pentru link-uri folosind o singura imagine si CSS (2348)
  3. MySQL Alias si functii (1479)
  4. Lectia 173, Recapitulare 155-156 (9)
  5. Prezentul simplu - Exercitii si teste incepatori (53295)

Popular pages this month

  1. Cursuri si Tutoriale: Engleza, Spaniola, HTML, CSS, Php-Mysql, JavaScript, Ajax (302)
  2. Curs PHP MySQL, Tutoriale si Scripturi PHP (170)
  3. Curs si Tutoriale JavaScript (169)
  4. Curs HTML gratuit Tutoriale HTML5 (165)
  5. Curs CSS Online Tutoriale CSS3 (152)