js基礎---js改變html屬性
阿新 • • 發佈：2022-05-10
js，JavaScript的縮寫，JavaScript 是屬於 HTML 和 Web 的程式語言。
JavaScript 是 web 開發者必學的三種語言之一：
HTML 用於定義網頁的內容
CSS 用於規定網頁的佈局
JavaScript 用於對網頁行為進行程式設計
js具有多種方法，例如：
getElementById()，此方法用於通過“id”的繫結，改變在html中的元素
程式碼如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>通過繫結id改變內容</h1>
<p id="demo">js 可以更改 html 內容。</p>
<button type="button" onclick="test()">點選這裡</button>
</body>
</html>
<script>
function test() {
document.getElementById('demo').innerHTML = '改變後'
}
</script>
點選前內容為p標籤中的內容，點選後為“改變後”，如圖所示：
同樣，通過js也可以改變css的樣式：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h1>通過繫結id改變內容</h1>
<p id="demo" style="color: yellow">js 可以更改 html 內容。</p>
<button type="button" onclick="test()">點選這裡</button>
</body>
</html>
<script>
function
以上程式碼將原本黃顏色的文字，通過js改變了文字中的css的color屬性，顏色變為紅色，效果如下：
以上例子還有多種，js的功能也不止如此。