「JavaScript」querySelectorでセレクタを使用する
書式
document.querySelector(“h2, h3").style.backgroundColor=値
※最初に合致したHTML要素(h2要素)を取得します。
使用例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>querySelectorによるhtml要素</title>
</head>
<body>
<h2> h2要素 querySelector適用</h2>
<h3> h3要素 querySelector適用しない</h3>
<script>
//セレクタh2 h3を使用 最初要素h2の背景色を設定
document.querySelector("h2, h3").style.backgroundColor = "skyblue";
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>querySelectorによるhtml要素</title>
</head>
<body>
<h2> h2要素 querySelector適用</h2>
<h3> h3要素 querySelector適用しない</h3>
<script>
//セレクタh2 h3を使用 最初要素h2の背景色を設定
document.querySelector("h2, h3").style.backgroundColor = "skyblue";
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>querySelectorによるhtml要素</title>
</head>
<body>
<h2> h2要素 querySelector適用</h2>
<h3> h3要素 querySelector適用しない</h3>
<script>
//セレクタh2 h3を使用 最初要素h2の背景色を設定
document.querySelector("h2, h3").style.backgroundColor = "skyblue";
</script>
</body>
</html>