Hoe een knop in JavaScript te schakelen

• Hoe een knop in JavaScript te schakelen?
• Voorbeeld 1: Tekstberichten wijzigen door op een knop te drukken
• Voorbeeld 2: AAN/UIT-knop in JavaScript omschakelen

Hoe een knop in JavaScript te schakelen?

Een voorwaardelijke instructie is een basisvereiste voor het wisselen van een knop in JavaScript. Om dit te bereiken, moet u het element ophalen en vervolgens wordt een aangepaste functie toegepast om een ​​specifieke bewerking op dat element toe te passen. De functie is gekoppeld aan de onclick-gebeurtenis van de knop. Zodat, telkens wanneer op de knop wordt geklikt, die functie wordt uitgevoerd. Laten we enkele voorbeelden oefenen om een ​​knop in JavaScript om te schakelen.

Voorbeeld 1: Tekstberichten wijzigen door op een knop te drukken

Een voorbeeld wordt beschouwd als het wijzigen van een bericht door een knop in JavaScript te schakelen. Het voorbeeld omvat HTML- en JavaScript-code, die hieronder worden uitgelegd:

HTML code

In HTML-code is de beschrijving als volgt:

• EEN
  tag is gemaakt met een ' id=js ”.
• Daarna wordt een knop gemaakt die is gekoppeld aan een “btntog()” methode. Door te drukken 'Knop' , de methode ' btntog() ' wordt geactiveerd.
• Op het einde, het JavaScript-bestand “test.js” wordt doorgegeven als src binnenin
  

  ---

  JavaScript-code

  functiebtntog ( )
  {
  waar = document. getElementById ( 'js' ) ;
  als ( t. innerlijkeHTML == 'Welkom bij Linuxhint' ) {
  t. innerlijkeHTML = 'JavaScript-wereld' ; }
  anders {
  t. innerlijkeHTML = 'Welkom bij Linuxhint' ; }
  }

  In deze code:

  
  
  
  • getElementById wordt gebruikt om het HTML-element ' js ” en de waarde wordt opgeslagen in een variabele “ t ”.
  • Daarna is de innerlijkeHTML eigenschap wordt gebruikt in de if-voorwaarde om de tekst te controleren ' Welkom bij Linuxhint ”.
  • Als de voorwaarde waar is, wordt de inhoud ' Welkom bij Linuxhint ” wordt vervangen door 'JavaScript Wereld “.
  • Als de voorwaarde onwaar is, wordt de tekst 'Welkom bij Linuxhint' wordt toegewezen als HTML-inhoud aan de div-tag.

  Uitgang:

  

  De uitvoer laat zien dat het omschakelen van een knop twee berichten retourneert als: 'Welkom bij Linuxhint' en 'JavaScript-wereld' alternatief.

  Voorbeeld 2: AAN/UIT-knop in JavaScript omschakelen

  Een voorbeeld wordt gevolgd om de inline-tekst van de knop te wijzigen. In dit voorbeeld is de “ AAN UIT ” tekst zal de waarde ook wijzigen door op de knop te drukken. De HTML- en JavaScript-codes vindt u hier:

  HTML code

  < html >
  
  < h2 > Voorbeeld om een ​​knop te wisselen h2 >
  
  < invoertype: = 'knop' ID kaart = 'mijnBtn' waarde = 'UIT'
  
  bij klikken = 'datum();' >
  
  < script src = 'test.js' > script >
  
  html >

  De bovenstaande code wordt beschreven als:

  • Een klikbare knop met een id van “mijnBtn” is gemaakt en de waarde is ingesteld op 'UIT' .
  • Door op de knop te drukken, wordt de datum() methode wordt geactiveerd.
  • Uiteindelijk, “test.js” is gekoppeld aan het bronpad binnen