Jquery 复习练习,02Javascript 与jquery 互转 onclick 与click区别

Javascript 与jquery 互转

jquery 为<script src="jquery-1.8.3.js"></script>

以checkbox为例:

示例:<input type="checkbox" onClick="checkName()" name="ckGroup"  />

需求:触发checkbox的onClick事件,在JS中分别调用 onclick() 和 click()方法

 

onclick :checkName()方法执行完毕以后设置checkbox.checked 为 true 或false

 

click :checkName()方法执行之前设置checkbox.checked 为 true 或false

 

在JQuery中,click()方法等同与调用onclick()方法,当你需要获取checked的属性值时需要注意他们之间的区别。

同时,

$("#ID input").each(

  function(){

    $(this)[0].click();

  }

);

与

$("#ID").each(

  function(){

    $(this).children(":checkbox")[0].click();

  }

);

之间,前者的click()方法类似于调用DOM对象的onclick()方法,后者的click()方法类似于调用DOM对象的click()方法
  <script type="text/javascript">
        $(function () {
            $("input").click(function () {
              var a=  $("#shang ul  li span");
              var b = a.get(0);  //jq 对象转 js 对象
              b.innerHTML = "张三";

              var c = $(b); //js 对象转 jq对象
                c.css("background-color", "green");
            });
        });

    </script>
</head>
<body>
<input type="button" value="dianji"/>
<div >dddds
    <ul>
        <li>fasl</li>
        <li> sssss<span> span hong</span></li>
    </ul>
</div>
</body>