ASP.NET MVC - Elementmanipulation i DOM

Förutom att kunna manipulera händelserna när vi interagerar med elementen, Javascript tillåter oss att ändra de grundläggande egenskaperna hos dessa, detta är mycket användbart eftersom vi med en händelse kan få ett element att ändra färg eller kanske lägga till ett nytt element.
Det mest intressanta är det med hjälp av ASP.NET Vi kan skapa rutiner som interagerar med kontrollerna för att generera denna typ av beteende dynamiskt och med databasinnehåll.
Ändra DOMTill ändra DOM Vi ska använda jQuery Eftersom detta Javascript -ramverk låter oss spara mycket kod och redan har några funktioner som gör det kompatibelt med de flesta webbläsare, beror det senare på att vi måste komma ihåg att allt vi gör i DOM är på klientsidan, därför är det dess miljö som kanske begränsar oss eller inte …
Ändra CSS
De CSS är det som kommer att ge stilar till våra element i SOL Av denna anledning är det mycket viktigt, låt oss föreställa oss att vi har viss validering och vi vill att när denna validering inte är godkänd visar vi en röd ruta för att indikera misslyckandet vid manipulering av SOL Vi kan uppnå detta på följande sätt, låt oss se bilden med exemplet:

Här lyfter vi fram är .css () -metod, Som vi kan se passerar vi två parametrar, den första parametern är egenskapen CSS som vi vill lägga till eller aktivera och den andra parametern är värdet som den här egenskapen ska ta.
Lägg till ett nytt objekt
Inte bara kan vi ändra befintliga element, vi kan också lägga till nya element, med detta kan vi infoga text, lägga till nya block, etc.
Vilken metod ska man använda?För detta kan vi använda .append () metoddär vi som parameter kommer att placera HTML -innehållet som vi vill infoga i vår DOM, det enda vi måste tänka på är att vi behöver ett element med ett unikt id För att använda den som väljare, låt oss se i följande bild hur vi kan uppnå detta.

Vi kan också ta bort element, detta är mycket viktigt eftersom rörelse- och handlingseffekter kan uppnås i applikationen, med detta kommer användaren att se effekterna av sina handlingar i realtid, för detta kommer vi att använda .remove () metod och inuti passerar vi väljaren som vi vill ta bort från vår DOM:

FÖRSTORA

Här ser vi i exemplet hur vi enkelt tar bort elementet endast genom att ange etiketten på väljaren.
Övriga fastigheter
Vi kan manipulera alla egenskaper hos elementet, det enda är att vi måste dokumentera oss själva, eftersom det är svårt att känna dem alla utantill, men på Internet har vi jQuery guide med vilken vi kan använda den officiella dokumentationen medan vi gör vår utveckling.
Det viktiga i det här fallet är att veta vad vi vill göra, det är nyckelpunkten då kan vi undersöka och lära oss på vägen, så länge vi känner till den grundläggande aspekten kommer vi att må bra.
Med detta avslutar vi denna handledning, som vi kan se är det ganska enkelt att interagera på en högre nivå med DOM -träd, mycket av denna anläggning beror på jQuery som underlättar denna interaktion.Gillade du och hjälpte denna handledning?Du kan belöna författaren genom att trycka på den här knappen för att ge honom en positiv poäng