jquery事件1,2

<h4>jquery事件</h4>
    <style>
        #php{width: 200px;height: 40px;}
        .con5{width: 200px;height: 200px;border: 1px solid #ccc;}
        #selac{width: 200px;height: 40px;margin: 20px;float: left;margin-bottom: 100px;border: 0px;}
        .con11{width: 200px;height: 50px;background: #ccc;}
    </style>
    <script>
        $(document).ready(function(){
            $('#php').blur(function(){
                $('#php').css({'background':'#ccc'});
            })
            $('#php').focus(function(){
                $('#php').css({'background':'pink'});
            })
            $('#cli').click(function(){
                console.log('today is friday!');
            })
            $('.con11').mouseover(function(){
                $('.con11').css({'border':'5px solid pink'});
            })
            $('.con11').mouseleave(function(){
                $('.con11').css({'background':'#ea5404'});
            })
            $('#selac').change(function(){
                $('#selac').css({'background':'green'});
            })
        })
    </script>
    <div class="con5"></div>
    <input type="text" value="php中文网" name='php' id='php'>
    <input type="button" value="点击" id="cli"><br>
    <select name="selec" id="selac">
        <option value="php">php</option>
        <option value="java">java</option>
        <option value="c">c</option>
        <option value="c++">c++</option>
        <option value="python" selected>python</option>
    </select>
    <div class="con11">
        php zhongwen wang !
    </div>