JS implementiert eine Methode zum Ändern von Textfarbe und -inhalt in HTML-HTML-Tutorial-php.cn

JS implementiert eine Methode zum Ändern von Textfarbe und -inhalt in HTML

不言

Freigeben： 2018-06-05 15:31:55

Original

2522 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Methode von JS zum Ändern der Textfarbe und des Inhalts in HTML vorgestellt, einschließlich Techniken im Zusammenhang mit mathematischen JS-Operationen und dynamischen Operationen von Seitenelementen. Freunde in Not können sich darauf beziehen

Dieser Artikel beschreibt JS mit Beispielen. Implementieren Sie Methoden zum Ändern von Textfarbe und Inhalt in HTML. Teilen Sie es als Referenz mit allen:

1. JavaScript

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
 <TITLE> Day 1 </TITLE>
 <META NAME="Generator" CONTENT="EditPlus">
 <META NAME="Author" CONTENT="">
 <META NAME="Keywords" CONTENT="">
 <META NAME="Description" CONTENT="">
 <script>
  // to change the color of an object.
  function changeColor(){
  x=document.getElementById("Id1");
  x.style.color="Red";
  }
  // to change the content of an object.
  function changeContent(){
  y=document.getElementById("Id2");
  y.innerHTML="Hi, you have changed the contents using Java Script successfully!";
  }
  </script>
 </HEAD>
<BODY bgcolor="AntiqueWhite">
  <h1 ><center>Welcome Page</center></h1>
  <p id="Id1">It is test 1.</p>
  <p id="Id2">It is test 2.</p>
  <button type="button" onclick ="changeColor()">
    Change color of test 1
  </button><br/><br/>
  <button type="button" onclick ="changeContent()">
    Change content of test 2
  </button>
 </BODY>
</HTML>

Nach dem Login kopieren

Tag 1.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
 <TITLE> Day 1 </TITLE>
 <META NAME="Generator" CONTENT="EditPlus">
 <META NAME="Author" CONTENT="">
 <META NAME="Keywords" CONTENT="">
 <META NAME="Description" CONTENT="">
 <script>
  // to change the color of an object.
  function changeColor(){
  x=document.getElementById("Id1");
  x.style.color="Red";
  }
  // to change the content of an object.
  function changeContent(){
  y=document.getElementById("Id2");
  y.innerHTML="Hi, you have changed the contents using Java Script successfully!";
  }
  </script>
 </HEAD>
<BODY bgcolor="AntiqueWhite">
  <h1 ><center>Welcome Page</center></h1>
  <p id="Id1">It is test 1.</p>
  <p id="Id2">It is test 2.</p>
  <button type="button" onclick ="changeColor()">
    Change color of test 1
  </button><br/><br/>
  <button type="button" onclick ="changeContent()">
    Change content of test 2
  </button>
 </BODY>
</HTML>

Nach dem Login kopieren

3. Screenshot des Laufeffekts :

Verwandte Empfehlungen:

JS-Methode zum Sperren von HTML-Seitenelementen beim Laden

js erhält HTML Die Wertmethode des Span-Tags (super einfach)

Das obige ist der detaillierte Inhalt vonJS implementiert eine Methode zum Ändern von Textfarbe und -inhalt in HTML. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!