java，jsp页面添加提示图以及提示音乐

效果如下：

前台代码
<!-- 使用h5写的提醒图片-->
 <style>
.tx{ width:38px;height:30px;display:inline- block;background:url("../../../images/sos.gif") no-repeat;position:relative;top:5px;left:3px;<!-- 使用h5写的提醒图片-->
}
</style>   

  <!--下载的音乐 -->
 <a href="#" id="MsgNum"><i onclick="remind()"><i class="hasxx"></i></i></a>
 <audio autoplay="autoplay" loop="loop" id="remindSound"></audio><!--下载的音乐 -->
 <!--当进入时候就会执行方法-->
$(document).ready(function (){
    remindTasking();
 });
 <!--执行完以下代码之后为重点：添加提示图片以及音乐-->
function remindTasking(){
$.ajax({
    url: "/remind/remindList.html",
    type: "post",
    dataType:"json",
    cache: false,
    async: false,
    success: function(data){//请求成功之后
        if(data.length>0){//如果有数据                   
            $('#MsgNum').attr("title","你有"+data.length+"条未读消息");
            $('#recolor').attr("color","red");
            $("#remindSound").attr("src","../../../music/7821.mp3");//添加音乐
            $('#MsgNum .hasxx').addClass('tx');//添加显示的图片
        }else{  //如果没有数据
            $("#remindSound").attr("src","");//将音乐清空
            $('#recolor').attr("color","white");
            $('#MsgNum .hasxx').removeClass('tx');//将显示的提示图片去掉
        }
    }
 })
}

如果有数据此时会有图片音乐，如上图所示：
注： （1）后台代码我就不写了；
（2）添加音乐使用的标签：

(3)图片就不多说了；
希望对你有用