Hvordan skrive ut HTML -innhold på klikk på en knapp, men ikke siden?

Hvordan skrive ut HTML -innhold på klikk på en knapp, men ikke siden?
Når en bruker klikker på en knapp, tillater HTML dem å legge til data i en beholder og skrive ut noe HTML -innhold. Som et resultat åpnes nettleserens utskriftsdialog, men innholdet. Imidlertid skriver denne operasjonen ut en annen HTML -tekst som ikke er synlig på siden.

Dette innlegget vil demonstrere om å skrive ut HTML -innholdet med klikket på en knapp, men ikke siden.

Hvordan skrive ut innhold av HTML ved å klikke på en knapp?

CSS “@media”Regel brukes til å bruke en del av et stilark basert på resultatene fra ett eller flere medier. Brukere kan gi en medieforespørsel hvis og bare hvis den tilfredsstiller enheten som brukes til å se innholdet.

For å skrive ut HTML -innholdet med et klikk på en knapp, kan du prøve instruksjonene nedenfor.

Trinn 1: Sett inn første overskrift

Først av alt, legg til den første overskriften ved hjelp av overskriften fra "

" til "
”Tag, der

Taggen brukes til den viktigste overskriften.

Trinn 2: Legg til andre overskrift

Deretter legger du til en annen overskrift ved hjelp av “

Trinn 3: Opprett knapp

Etter det, lag en knapp ved å bruke "”Element. Legg deretter til følgende attributter inne i:

  • type”Attributt tildeler inngangstypen. For eksempel "knapp”Type brukes til å opprette en knapp.
  • Neste, “verdi”Attributt brukes for å spesifisere verdien for et inngangselement. Denne attributtet kan brukes på mange måter for forskjellige inngangstyper.
  • Brukeren kan bruke "Ved trykk”Attributt til å utføre en hendelse på et HTML -element.
  • klasse”Angir en eller flere klasser for et element. Klasseattributtet brukes mest til å peke på en klasse i et stilark:


Linuxhint Content Creators (skriv ut dette)



TSL -innholdsskapere (ingen trykk)


Som et resultat opprettes det en knapp som kan brukes til å skrive ut HTML -innholdet på et klikk på en knapp.

Hvordan skrive ut HTML -innhold på klikk på en knapp, men ikke siden?

For å skrive ut HTML -innholdet med et klikk på en knapp uten å skrive ut hele siden, se på de gitte instruksjonene.

Trinn 1: Bruk “@media” -regelen

Nå, bruk "@media”Regel for å skrive ut det spesifikke innholdet i DIV uten å skrive ut hele siden. For å gjøre det, få tilgang til Div -klassen ved å bruke “.noprint ”-velger.

Trinn 2: Tilgangsklasseattributt

@Media Print
.noprint
Display: Ingen;


H1
Farge: RGBA (50, 9, 233, 0.4);

Få tilgang til klasseattributtet ved å bruke verdien av klassen og bruke "vise”Eiendom av CSS med verdien”ingen”. Deretter bruker du “farge”Eiendom til overskriften brukeren ønsker å skrive ut.

Produksjon

Det kan observeres at når knappen er klikket, er det ekstra HTML -innholdet klart til å skrive ut.

Konklusjon

For å skrive ut innholdet i HTML ved å klikke på en knapp, men ikke siden, oppretter du først to overskrifter. Opprett deretter en knapp ved å bruke "”Element og legg til attributtene, inkludert“type”,“ved trykk”, Og“klasse”. Deretter, bruk "vindu.skrive ut()”Som en“ved trykk”Verdi. Etter det, bruk "@media.skrive ut”Regel og få tilgang til klasseverdien for å skrive ut HTML -innholdet med et klikk på en knapp. Dette innlegget demonstrerte metoden for å skrive ut innholdet på klikk på en knapp.