✅ ASP.NET MVC - selektory

Spisie treści

Struktura, na której będziemy pracować po stronie klienta, to drzewo DOM dokumentu HTML, to drzewo jest strukturą hierarchiczną, w której każdy element widoczny w sieci jest reprezentowany przez odpowiednią etykietę.
Znajomość tej struktury polega na tym, że pozwoli nam ona zlokalizować różne elementy, dzięki czemu możemy przyjąć wartość, którą zawierają lub dołączyć tekst, treść z innych stron, możemy przetwarzać kontroler naszej aplikacji i generować widok w ramach strona bez konieczności jej ładowania itp.
Odwołaj się do elementu
Jak wspomnieliśmy wcześniej, HTML Ma strukturę, w której zawiera swoje elementy, aby manipulować tymi elementami, musimy nauczyć się tworzyć odniesienia do nich, z referencją możemy upewnić się, że weźmiemy żądany element lub elementy i będziemy mogli je modyfikować.
Najbardziej efektywny sposóbJednym z najpopularniejszych i najskuteczniejszych sposobów jest selektor identyfikatora, jak wiemy, etykiety mogą mieć unikalne identyfikatory, aby móc odróżnić elementy a HTML.
Zobaczmy na poniższym obrazku kod, w którym możemy wziąć dzięki JavaScript element używający swojej własności id:

W kodzie, który widzieliśmy, mamy etykietę HTML div, to ma identyfikator, ta właściwość jest tą, o której wspomnieliśmy, która pomoże nam zlokalizować i wybrać element w SŁOŃCE, w obrębie bloku JavaScript dzięki przedmiotowi dokument, Możemy użyć jednej z jego metod, aby uzyskać element po id i w tym przypadku umieszczamy to samo z div i na końcu metodą tekst wewnętrzny, przypisujemy mu nowy tekst.
Jak widzimy, strona została wzbogacona, mimo że jest dość prostym przykładem, to jest to najbardziej podstawowa rzecz, którą musimy wiedzieć, aby zbudować solidny fundament.
Ulepszanie z jQuery
Jak wiemy JavaScript czasami możesz grzeszyć, że musisz pisać dużo kodu, aby zrobić kilka rzeczy, w tym momencie wejdź jQuery pakowanie wspomnianych funkcji i kodów, co pozwala nam rozwiązywać te same funkcje za pomocą skrótów i mniejszej ilości kodu, nadal jest JavaScript ale napisane w prostszy sposób.
W poniższym przykładzie zobaczymy, jak przepisujemy poprzedni przykład za pomocą jQuery:

Jak widać, podsumowaliśmy liczbę wywołań metod za pomocą po prostu .text() metoda zastosowane do selektor $ (), w zależności od tego, jak nazwiemy nasz żywioł jQuery umożliwia nam dostęp do id, klas, w tym według typu elementów, ich dzieci itp.
Na przykład, jeśli chcemy zrobić ten sam poprzedni przykład, ale w tym przypadku etykietazamiast identyfikatora ma klasę:

Witaj świecie!

Tutaj widzimy, że zamiast wywoływać selektor z $ („# selektor”), robimy to za pomocą $ (".selector"), problem z tym polega na tym, że jeśli mamy więcej niż jeden element o tej samej klasie, wpłyniemy na to.
Na tym kończymy ten samouczek, w którym zagłębiliśmy się nieco bardziej w koncepcję selektorów i jak ich używać z JavaScript normalne jak z jQuery zmniejszając w ten sposób ilość kodu, który piszemy.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt