javascript - 如何获取三个顶部按钮的位置，然后滚动？

Question

默认为商品详情，当向下滚动的时候，用户单击商品评价。。。
不能向上滚动到顶部位置。用户只好手动向上滚动才能看到评价位置。
请问是具体写法是怎么样子？

<ul class="col-lg-8 tb-mid nav nav-tabs" id="goods_detail_tab">
<li class="product-grade active">
    <a href="#home" data-toggle="tab" aria-expanded="true">商品详情</a> <!--选顶卡 1-->
</li>
<li class="product-grade">
    <a href="#ios" data-toggle="tab" aria-expanded="false">商品评价</a> <!--选顶卡 2-->
</li>
<li class="product-grade">
    <a href="#baozhang" data-toggle="tab" aria-expanded="false">售后保障</a> <!--选顶卡 3-->
    <p class="tabbar-bg" style="display: none;"></p>
</li>
</ul>

<p id="myTabContent" class="tab-content">
<p class="tab-pane active in" id="home">   <!--选顶卡 内容 1-->
    <p id="section1">
        <img src="res/img/product/xx_07_01.jpg" alt="">
    </p>
    <p id="section2">
        <img src="res/img/product/xx_07_02.jpg" alt="">
    </p>
    <p id="section3">
        <img src="res/img/product/xx_07_03.jpg" alt="">
    </p>
    <p id="section4">
        <img src="res/img/product/xx_07_04.jpg" alt="">
    </p>
</p>
<p class="tab-pane fade container" id="ios">  <!--选顶卡 内容 2-->
    <p class="tab-xl-2">
        <p class="xl-1">
            <p class="cl-1">
                <input type="radio" name="" id="a"><label for="a">全部</label>
                <input type="radio" name="" id="b"><label for="b">有图</label>
                <input type="radio" name="" id="c"><label for="c">追评</label>
                <input type="radio" name="" id="d"><label for="d">好评</label>
                <input type="radio" name="" id="e"><label for="e">中评</label>
                <input type="radio" name="" id="f"><label for="f">差评</label>
            </p>
        </p>
        <!--客户评价-->
        <p class="xl-2">
            <p class="cl-2">
                <span>2015-1-1   12:48</span>
                <p>    总的来说还是比较让人满意的，用起来也蛮舒服，就是用完了之后
                    大家都说我像天翼4G；人家才不是天翼4G，天翼4G就是抄袭的人家。
                    所以说我给个三星，这个三星才不是韩国那个做手机的三星，人家
                    是用土豪金苹果的大土豪。
                    就酱，如果还要我说一些的话……恩……
                    哎呀不造说啥啦我做个预览图容易么我！！
                    好啦不要再问了！</p>

                <p><img src="res/img/product/a1.jpg">&nbsp;&nbsp;<img src="res/img/product/a1.jpg"></p>
                <span>型号：XS    大小：大大大   颜色：基佬紫</span>

            </p>
            <p class="cl-3">
                <img src="res/img/product/star1.jpg">
                <p>中评</p>
            </p>
            <p class="cl-4">
                <p><img src="res/img/product/a1.jpg" alt=""></p>
                <p>我不是小开</p>
                <em>Lv2</em>
            </p>
        </p>


    </p>
</p>
<p class="tab-pane" id="baozhang">  <!--选顶卡  内容 3-->
    asdfasdfasdfadfafds
</p>
</p>