2019年4月11日 星期四

JavaScript變更HTML的內容

<JavaScript程式語言>

JavaScript變更HTML的內容

document.getElementById("demo1").innerHTML

<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

<p id="demo1">A Paragraph.</p>
<p id="demo2">A Paragraph.</p>

<div id="myDIV1">A DIV.</div>
<div id="myDIV2">A DIV.</div>
<script>
document.getElementById("demo1").innerHTML="Hello World...1";
document.getElementById("demo2").innerHTML="Hello World...2";
document.getElementById("myDIV1").innerHTML="Hello JavaScript !";
document.getElementById("myDIV2").innerHTML="How are you?";

</script>

</body>
</html>


輸出畫面

My Web Page

Hello World...1
Hello World...2
Hello JavaScript !
How are you?


<!DOCTYPE html>
<html>
<body>

<h1>My Web Page</h1>

<p id="myPar">I am a paragraph.</p>
<div id="myDiv">I am a div.</div>

<p>
<button type="button" onclick="myFunction()">点击这里</button>
</p>

<script>
function myFunction()
{
document.getElementById("myPar").innerHTML="Hello World";
document.getElementById("myDiv").innerHTML="How are you?";
}
</script>

<p> 当您点击上面的按钮时,两个元素会改变。 </p>

</body>
</html>


輸出畫面

My Web Page

I am a paragraph.
I am a div.

当您点击上面的按钮时,两个元素会改变。

按  点击这里 

My Web Page

Hello World
How are you?

当您点击上面的按钮时,两个元素会改变。

沒有留言:

張貼留言

2024_09 作業3 以Node-Red 為主

 2024_09 作業3  (以Node-Red 為主  Arduino 可能需要配合修改 ) Arduino 可能需要修改的部分 1)mqtt broker  2) 主題Topic (發行 接收) 3) WIFI ssid , password const char br...