DOM对象与jquery对象

<ul>
    <li id="cloth">衣服</li>
    <li>裤子</li>
    <li>外套</li>
    <li>袜子</li>
</ul>
<script src="jquery-1.12.4.js"></script>
<script>
    /*
    * DOM对象：用js的方式获取到的对象是DOM对象
    * jquery对象：用jq的方式获取的对象是jq对象
    *
    * DOM与jquery的区别和联系：
    *1：区别：js对象与jq对象的方法不能混着用
    *2：联系：可以相互装换
    *   DOM===》jquery  $()
    *   jquery====》DOM   $li[0]    $li.get()
    *
    * */

    //DOM===》jquery  $()
    var cloth=document.getElementById("cloth");
    $(cloth).text("呵呵");

    //jquery====》DOM   $li[0]    $li.get()
    var $li=$("li");
    $li[0].style.backgroundColor="pink";
    //或
    $li.get(1).style.backgroundColor="#ccc";
</script>