解释下面JS

Question

 <script>    $(document).ready(function(){  $(".add_list ul .li_2 div").click(function(){  $(this).toggleClass('active');  var title = $(this).attr("title");  var dq=$(this); $(this).find('span').toggle(function(){ dq.find('span').append('<input name="" type="hidden" value="">')}, function(){ dq.find('span').append('<input name="" type="hidden" value="">')}  );    }); });    </script>

Answer 1

首先 ， $(document).ready(function(){

            }); 表示文档结构已经加载完成（不包含图片等非文字媒体文件）时要执行的操作，也就是其内部的内容。然后我们再逐一去看这个function内部都执行了哪些操作：

之后是找到class=“add_list”下面的 ul  且ul的class=“li_2”下面的div    如果符合以上条件的div被点击，将执行以下操作，首先改变这个div的class。  $(this).toggleClass('active');这句话的意思是，当该节点有“active”的时候，该class被移除，当没有的时候，该属性被添加。var title = $(this).attr("title");这句话的意思是，取出该节点的title值并且赋值给变量title。在接下来的那个函数是指找到该节点下的<span>节点并且给它添加HTML内容<input name="" type="hidden" value="">