html——jq补充（scroll：(滚动条)；添加子元素 ；添加兄弟元素；筛选（eq；for in ; json ）

scroll：(滚动条)

    /*$(document).click(function () {
        console.log(1);
        console.log("滚动高度"+$(this).scrollTop());          打印出目前滚动条的高度
        console.log("滚动宽度"+$(this).scrollLeft());
    });*/

    $(document).click(function () {                      点击事件，点击过后使滚动条的高度  宽度 到达一定的位置
        console.log(1);
        console.log($(this).scrollTop(1000));
        console.log($(this).scrollLeft(500));
    });

 

append prepend：（jq添加子元素）

  /*
       添加子元素 可以是标签、文本、js对象、jq对象
         append  添加弟弟
         prepend  添加哥哥

         appendTo
         prependTo
        */
        // $("#box").append("<b>我是append的</b>");  添加在下面
        // $("#box").prepend("<b>我是prepend的</b>");  添加在上面
        // $("#box").append($("b"));   将页面中的p标签  移到 #box 中  排在最下面

        $("<em>我是appendTo</em>").appendTo($("#box"))  如上一样

before affter：（添加兄弟元素）

    /*
           添加兄弟元素
           after    在之后加入
           before  在之前加入

           insertAfter
           insertBefore   用法如 上
        */

        $("#box").after("<b>我是after</b>");
        $("#box").before("<div>我是before</div>")

 

筛选（eq）：

      /*
       eq  把jq转换成特定的jq
       hasClass 检查当前的元素是否含有某个特定的类，如果有，则返回true。否则返回false
       children 找儿子 可以不传参数
       find  不传参，默认不找  传参的话就找符合参数的后代
       parent 不需要参数  只找父级
       parents 会找所有的上代  直到html
       parents(".show")找到名字叫做show的祖先
       siblings 不传参 所有兄弟 传参 所有兄弟按照参数筛选出合格的
        */
        //alert($("#box").hasClass("show"));//true            判断是否 含有名为show的class名  有为true
        //alert($("#box").hasClass("show1"));//false

        //console.log($("#box").children());               显示#box下的孩子
        //console.log($("#box").find("p"));                查找 后代为p的
        //console.log($(".box").parent());              查找 。box的父亲
       // console.log($(".box").parents());             查找所以.box的祖宗
        console.log($(".box").parents(".show"));          
        console.log(typeof $(".box").parents(".show"));       

        // $("p").siblings().css("color","red");                  所有p标签兄弟元素都加上这个样式
        // $("p").siblings(".box").css("color","red");          p标签的兄弟元素class名为box的加上这个样式

           

for in：（一般取{}中的值）

  用法为：

   var obj = {"name": "xiaopo", "age": 18, "gender": "girl"};
    console.log(obj);
    console.log(obj.length);//undefined   没有定义 取不出来
    console.log(obj.name);

    for(var a in obj){
        console.log(a,obj[a]);
        //a是{}里的属性值 obj[a] {}里面属性的值
    }

 

json:（含有 js  与 json 之间的转换）

    var obj = {"name": "xiaopo", "age": 18, "gender": "girl"};
    console.log(obj);
    console.log(typeof obj);//js对象   object

    //定义json字符串
    //直接定义var obj1 = '{"name": "xiaopo", "age": 18, "gender": "girl"}';

    /*var obj1 = '{"name": "xiaopo", "age": 18, "gender": "girl"}';    整体加上了引号
    console.log(obj1);
    console.log(typeof obj1);*/  字符串   string

    var obj1 = JSON.stringify(obj);/     /把js对象转换成json字符串
    console.log(obj1);
    console.log(typeof obj1);  string 

    var obj2 = JSON.parse(obj1);//          把Json字符串转换成js对象
    console.log(obj2);
    console.log(typeof obj2);   object