JavaScript HTML DOM - 改變CSS

來源:互聯網
上載者:User

標籤:

JavaScript HTML DOM - 改變CSS

HTML DOM 允許 JavaScript 改變 HTML 元素的樣式。

改變 HTML 樣式

如需改變 HTML 元素的樣式,請使用這個文法:

document.getElementById( id).style. property= new style

下面的例子會改變 <p> 元素的樣式:

執行個體<html>
<body>

<p id="p2">Hello World!</p>

<script>
document.getElementById("p2").style.color="blue";
</script>

<p>The paragraph above was changed by a script.</p>

</body>
</html>
嘗試一下 »

本例改變了 id="id1" 的 HTML 元素的樣式,當使用者點擊按鈕時:

執行個體<!DOCTYPE html>
<html>
<body>

<h1 id="id1">My Heading 1</h1>
<button type="button" 
onclick="document.getElementById(‘id1‘).style.color=‘red‘">
Click Me!</button>

</body>
</html>
嘗試一下 »

 

更多執行個體

Visibility
如何使元素不可見。您希望元素顯示或消失嗎?

JavaScript HTML DOM - 改變CSS

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.