Web使用技巧—html高亮显示源码示例

 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>高亮显示</title>
        <script>
            function change_color(id,flag){
                if(flag=='over'){
                    document.getElementById(id).style.backgroundColor='red';
                }else if(flag=='leave'){
                    document.getElementById(id).style.backgroundColor='white';
                }
                
            }
        </script>
    </head>
    <body>
        <table border="1px" width="500px" height="500px" align="center" id="tbl">
            <thead>
                <tr>
                    <th>排名</th>
                    <th>英雄</th>
                    <th>兵器</th>
                </tr>    
            </thead>
            <tbody>
                <tr id="tr1" οnmοuseοver="change_color('tr1','over');" οnmοuseleave="change_color('tr1','leave');">
                    <td>1</td>
                    <td>天机老人</td>
                    <td>天机棒</td>
                </tr>
                <tr id="tr2" οnmοuseοver="change_color('tr2','over');" οnmοuseleave="change_color('tr2','leave');">
                    <td>2</td>
                    <td>上官金虹</td>
                    <td>子母龙凤环</td>
                </tr>
                <tr id="tr3" οnmοuseοver="change_color('tr3','over');" οnmοuseleave="change_color('tr3','leave');">
                    <td>3</td>
                    <td>李寻欢</td>
                    <td>小李飞刀</td>
                </tr>
                <tr id="tr4" οnmοuseοver="change_color('tr4','over');" οnmοuseleave="change_color('tr4','leave');">
                    <td>4</td>
                    <td>郭嵩阳</td>
                    <td>嵩阳铁剑</td>
                </tr>
                <tr id="tr5" οnmοuseοver="change_color('tr5','over');" οnmοuseleave="change_color('tr5','leave');">
                    <td>5</td>
                    <td>吕奉先</td>
                    <td>温候银戟</td>
                </tr>
                <tr id="tr6" οnmοuseοver="change_color('tr6','over');" οnmοuseleave="change_color('tr6','leave');">
                    <td>6</td>
                    <td>白天羽</td>
                    <td>白家神刀</td>
                </tr>
            </tbody>
        </table>
    </body>
</html>

转载于:https://my.oschina.net/u/3980693/blog/2250536

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值