Scrie lucruri. Fa lucruri.

Utilizare

Este ca jQuery, dar mult mai putin util. Avand in vedere acest exemplu de fisier HTML,

<html style = “height: 100vh”> <head class = “kek”> <title class = “kek” data-bar = “foo”> Pagina HTML complexa </title> </head> <body class = “kek bur “style =” height: 100% “> <h1 id =” bar “class =” kek wow “> Wow acesta este un exemplu </h1> <input id =” quux “class =” kek foo “/> < iframe id = “baz” sandbox = “allow-same-origin allow-scripts allow-popups allow-forms” width = “100%” height = “100%” src = “example.org”> </iframe> </ corp> </html>
(let ((html (elq-read-file “~ / kek.html”))) (elq-el (car (elq- $ “.kek # quux” html))); => “input” (mapcar ‘ elq-el (elq- $ “.kek” html)); => (“input” “h1” “body” “title” “head”) (mapcar (lambda (el) (elq-el (elq-parent el ))) (elq- $ “.kek” html)); => (“body” “body” “html” “head” “html”) (mapcar (lambda (el) (mapcar ‘elq-el (elq- frati el))) (elq- $ “.kek” html)); => ((“h1” “input” “iframe”) (“h1” “input” “iframe”) (“head” “body”) (“title”) (“head” “body”)) (elq- $ “.kek” html); => Sper ca nu ti-a placut tamponul de mesaje (elq-write html nil));=> “<html style = \” height: 100vh \ “> … </html>”

Functii

I / O si analiza

  • (elquery-read-file FILE) – Analizati un fisier HTML, returnand o reprezentare interna a AST-ului sau. Utilizati (elquery -…) pentru a manipula acest AST.
  • (elquery-read-string STRING) – Analizati un sir HTML, returnand o reprezentare interna a AST-ului sau. Utilizati (elquery -…) pentru a manipula acest AST.
  • (elquery-write TREE) – Returneaza un sir al reprezentarii html a TREE si a copiilor sai.
  • (elquery-fmt TREE) – Returneaza un sir al reprezentarii html a nodului cel mai de sus al TREE, fara copiii sau eticheta de inchidere.

DOM Traversal

Selectia trasaturilor comune

  • (elquery-class? NODE CLASS) – Returneaza daca NODE are clasa CLASS
  • (elquery-id NODE) ​​- Intoarceti ID-ul NODE
  • (elquery-classes NODE) ​​- Returneaza o lista a claselor de NODE
  • (elquery-text NODE) ​​- Returneaza textul continut in NODE. Daca exista mai multe elemente de text, de exemplu, <span> Hello <span> cruel </span> world </span>, returneaza concatenarea acestor noduri, Hello world, cu doua spatii intre Hello si world

Modificarea proprietatii

  • (elquery-props NODE) ​​- Returneaza un plist al proprietatilor acestui nod, inclusiv id-ul, clasa si atributele de date.
  • (elquery-data NODE KEY & VAL optional) – Returneaza valoarea proprietatii NODE’s data-KEY. Daca este furnizat VAL, setati distructiv proprietatea NODE data-KEY la VAL. De exemplu, pe nodul <span data-name = “adam”>, (nodul elquery-data “name”) ar returna adam
  • (elquery-prop NODE PROP si VAL optional) – Returneaza valoarea PROP in NODE. Daca este furnizat VAL, setati distructiv PROP la VAL.
  • (elquery-rm-prop NODE) ​​- Scoateti distructiv PROP din NODE

Predicati

  • (elquery-nodep OBJ) – Returneaza daca OBJ este un nod DOM
  • (elquery-elp OBJ) – Returneaza daca OBJ nu este un nod text
  • (elquery-textp OBJ) – Returneaza daca OBJ este un nod text

Functii generale ale arborelui

Deoarece HTML este o reprezentare de arbore mare, elq include cateva functii generale de manipulare a arborelui pe care le foloseste intern si va poate fi util atunci cand aveti de-a face cu DOM.

  • (elquery-tree-remove-if pred tree) – Eliminati toate elementele din TREE daca indeplinesc PRED. Pastreaza structura si ordinea arborelui.
  • (elquery-tree-remove-if-not pred tree) – Eliminati toate elementele din TREE daca nu indeplinesc PRED. Pastreaza structura si ordinea arborelui.
  • (elquery-tree-mapcar fn tree) – Aplicati FN la toate elementele din TREE
  • (elquery-tree-reduce fn tree) – Efectuati o reducere in ordine a TREE cu FN. Echivalent cu o reducere pe un copac aplatizat.
  • (elquery-tree-aplatizare copac) – Aplatizati copacul, eliminand toate cuiburile de lista si lasand o lista de numai elemente atomice. Aceasta nu pastreaza ordinea elementelor.
  • (elquery-tree-aplatizare-pana la arbore pred) – Aplatizati arborele, dar tratati elementele care se potrivesc cu PRED ca elemente atomice, fara a pastra ordinea.

Sintaxa selectorului

Suportam un subset semnificativ al sintaxei selectorului jQuery. Daca voi decide vreodata sa fac acest proiect si mai mult la scara web, voi adauga selectoare de colon si mai multe teste de egalitate a proprietatii.

  • #foo – Selectati toate elementele cu ID-ul „foo”
  • .bar – Selectati toate elementele cu clasa „bar”
  • [nume = utilizator] – Selectati toate elementele a caror proprietate „nume” este „utilizator”
  • # foo.bar [nume = utilizator] – Intersectie logica a celor trei selectoare de mai sus. Selectati toate elementele al caror cod este „foo”, clasa este „.bar”, iar „nume” este „utilizator”
  • #foo .bar, [nume = utilizator] – Selectati toate elementele cu clasa „bar” in subarborii tuturor elementelor cu id-ul „foo”, impreuna cu toate elementele al caror „nume” este „utilizator”
  • #foo> .bar – Selectati toate elementele cu clasa „bar” al carui parinte imediat are ID-ul „foo”
  • #foo ~ .bar – Selectati toate elementele cu clasa „bar” care sunt frati ale elementelor cu id-ul „foo”
  • #foo + .bar – Selectati toate elementele cu clasa „bar” care urmeaza imediat elementele cu ID-ul „foo”

Sunt permise toate permutatiile de relatii de uniune, intersectie, copil, copil urmator si frate.

Structura interna a datelor

Fiecare element este un plist, care este garantat sa aiba cel putin o pereche cheie-valoare si o cheie: el. Toate elementele acestui plist sunt accesibile cu functiile de mai sus, dar reprezentarea interna a unui nod de document este de mai jos pentru oricine suficient de curajos pentru a hack asupra acestui lucru:

  • : el – Un sir care contine numele elementului. Daca nodul este un „nod text”,: el este nul
  • : text – Un sir care contine concatenarea tuturor elementelor de text imediat sub acesta pe copac. De exemplu, nodul care reprezinta <span> Hello <span> cruda </span> lume </span> ar fi ~ Hello world ”.
  • : recuzita – O lista de proprietati HTML pentru fiecare element, incluzand dar fara a se limita la atributele sale: id, class, data- * si name.
  • : parinte – Un indicator catre elementul parinte. Emacs crede ca aceasta este o lista.
  • : copii – O lista de elemente imediat sub acesta pe copac, inclusiv noduri de text.

Structura de date utilizata in interogari prin intermediul (elquery- $) este foarte similara, desi nu are cuvant cheie text (PR bun venit!) Si are un cuvant cheie extra: rel, care specifica relatia dintre interogare si: copii. : rel poate fi unul dintre: urmatorul copil,: copil, urmatorul frate si: frate. Aceasta este utilizata de functia interna (elquery – $) care trebuie sa stabileasca daca poate continua recursivitatea in josul arborelui pe baza relatiei a doua intersectii intr-un selector.

ARTICOLE SIMILAREDE LA ACELAȘI AUTOR