jquery----中级函数

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>Document</title>

<style>

.div1{width: 1000px; height: 800px; background: yellow; color: red; font-size: 18px;}

</style>

    <script src='../jquery-3.1.1.min.js'></script>

    <script>

    $(function(){

        // $('div').parents('body').css('background','red');

        // $('span').siblings().css('background','yellow');

          // $('h2').clone().appendTo('h3');

          // $('span').wrap('<div>');

          // $('span').wrapInner('<div>');

          // $('h1').unwrap();

          // var elem=$('h1');

          // var elem2=elem.add('h3');

          // elem2.css('background','red');

           // $('li').slice(1,4).css('background','blue');

            // console.log($('form').serialize());

            console.log($('form').serializeArray());

    });

    </script>

</head>

<body>

<div class="div1">

          get()下标，和lenght属性 get（）可以把jquery转成原生的js<br/>

          参数就是集合的下标    用法$('div').get(0).interHtml;   <br/>

          for(i=0; i<$('li').get().length; i++){};  无参数时会循环集合<br/>

          outterWidth(); 可以获取隐藏元素的属性，<br/>

          offsetWidth(); 不可以获取隐藏元素的属性；<br/>

          .html()可以获取写入dom节点标签； .text()只能读取文本可写入文本<br/>

          .remove()删除对象和对象事件； .detach();删除对象但是不删除对象事件<br/>

          $(function(){...})Dom加载完执行函数   $(document).ready();页面加载完执行<br/>

           $('.div2').parents()获取当前元素的祖先节点（）；参数就是筛选的功能；可以过滤多个属性<br/>

          $('.div2').closest(); 获取元素最近的父级节点();必须要写筛选的参数，不支持多个<br/>

          $('div2').siblings();找所有兄弟节点，参数也是筛选功能；<br/>

          $('div2').nextAll();找上面的兄弟节点；<br/>

          $('div2').prevAll(); 找下面的兄弟节点；<br/>

          Until()截止；<br/>

          $('div2').parentsUntil();父级截止-参数为截止节点；<br/>

          $('div2').nextUntil();找上面截止的兄弟节点； 参数为截止的兄弟节点<br/>

          $('div2').prevAll();找下面截止的兄弟节点； 参数为截止的兄弟节点<br/>

          $('div2').clone();克隆节点 无参数的时候不克隆事件；参数为true时克隆事件<br/>

           $('span').wrap('');外部包装；每个标签包装一个; $('span').wrapAll('');<br/>

           $('span').wrapInner('');内部包装；     unwrap();删除包装（不包括body）<br/>

            $('li').slice(1,4); 从参数1，到参数2；选中；<br/>

             $('form').serialize();sting形成的串联；$('form').serializeArray()串联成数组形式<br/>

</div>

<div class="div2">

<span>1span</span>

<span>2span</span>

<h1>h1</h1><h2>h2</h2><h3>h3</h3>

<ul>

<li></li>

<li></li>

<li></li>

<li></li>

<li></li>

</ul>

<form>

<input type="text" name="a" value='1'/>

<input type="text" name="b" value='2'/>

<input type="text" name="c" value='3'/>

</form>

</div>

</body>

</html>
秒客网

jquery----中级函数

相关文章
