<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="initial-scale=1.0">
<title>要素の取得と操作1~要素の指示と中身の書き換え</title>
</head>
<body>
<h1>要素の取得と操作1~要素の指示と中身の書き換え</h1>
<div>span:<span>あああ</span></div>
<div>span:<span>あああ</span></div>
<div>span.test:<span class="test">あああ</span></div>
<div>span.test:<span class="test">あああ</span></div>
<div>span.test#a:<span class="test" id="a">あああ</span></div>
<div>span.test#b:<span class="test" id="b" >あああ</span></div>
<script>
var span_elements = document.getElementsByTagName('span');
// span_elements[0].innerHTML = 'span[0]:いいい';
var id_b = document.getElementById('b');
// id_b.innerHTML = 'span#b:いいい';
var class_tests = document.getElementsByClassName('test');
// class_tests[1].innerHTML = 'span.test[1]:いいい';
</script>
</body>
</html>