首先是style部分定义类名，并将想要实现的样式效果写入

<style> .blue{ color:blue; } //字体变为蓝色 .red{ color:red; } //字体变为红色 </style>

其次是js部分代码，引入jquery，将想要改变的样式类名加入元素或移除元素

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script> $(document).ready(function(){ $("#p1").mousedown(function(){ $("#p1").addClass("blue"); $("#p1").removeClass("red"); }); $("#p1").mouseup(function(){ $("#p1").addClass("red"); $("#p1").removeClass("blue"); }); }); </script>

最后是要改变的html元素，id名为p1
<p id="p1">这是一个段落。</p>