# 1. querySelector 選取你的 HTML 類別元素

- 如何使用 querySelector:

// HTML:

    <div class="testone"></div>
    <div class="testtwo"></div>
    <div class="testthree"></div>
    <div class="testfour"></div>
    <script src="js/all.js"></script>

- 縮短語法瀏覽的好方法:

例如: 我們通常會 var one 然後接著寫:

var one = document.querySelector('.testone').one.textContent = '1. 富邦悍將';

### 太長了，反而會造成瀏覽上的不便利:

- 會建議寫到指定元素即可，接著參考以下的寫法:
本節使用 querySelector 來改變 class 的文字範例:

var one = document.querySelector('.testone');
one.textContent = '1. 富邦悍將';

var two = document.querySelector('.testtwo');
two.textContent = '2. 中信兄弟';

var three = document.querySelector('.testthree');
three.textContent = '3. 樂天桃猿';

###### tags: `JavaScript - DOM 元素`