jquery知识点

1.带var和不带var的声明的变量的区别：

①带var：表示声明了一个全局变量，不可以delete删除；
不带var：表示声明了一个全局属性（window属性），可以delete删除。
②当我们使用访问一个没有声明的变量时（不带var），JS会报错；而当我们给一个没有声明的变量赋值时，JS不会报错，相反它会认为我们是要隐式声明一个全局变量，这一点一定要注意。
③var name=1 ->不可删除
sex=”girl“ ->可删除
this.age=22 ->可删除
④事实上是对属性赋值操作。首先，它会尝试在当前作用域链（如在方法中声明，则当前作用域链代表全局作用域和方法局部作用域）中解析 name； 如果在任何当前作用域链中找到name，则会执行对name属性赋值； 如果没有找到name，它才会在全局对象（即当前作用域链的最顶层对象，如window对象）中创造name属性并赋值。
注意！它并不是声明了一个全局变量，而是创建了一个全局对象的属性。
⑤在function内部，用var是局部变量，不用var是全局变量。

2.方式1：用firstChild，lastChild进行元素遍历:

var list = document.getElementById('list');
var child = list.firstChild;
console.log(list.nextSibling)
while(child != list.lastChild){
    if(child.nodeType == 1){
        console.log( child );
    }
    child = child.nextSibling;
}

3.方式2：使用firstElementChild，nextElementSibling

var list = document.getElementById('list');
var child = list.firstElementChild;
while(child){
    console.log( child );
    child = child.nextElementSibling;
}

注：js中的字典可以不加’‘单引号，也可以加单引号不影响！！！因为js会自动转为字符串

4.

$(“:button”) 表示匹配所有的按钮。
$(“input:checked”)表示匹配所有选中的被选中元素(复选框、单选框等，不包括select中的option)。

$(“div.container”)中的‘.‘号表示class， $(“div #msg”)中的‘#‘表示id。那么$(“:button”) 中的‘：‘表示类型(type),如$(“:button”) 表示类型为button的控件，$(“input:checked”)表示所有类型为选中的复选框元素

5.

attr 是从页面搜索获得元素值，所以页面必须明确定义元素才能获取值，相对来说较慢。
prop是从属性对象中取值，属性对象中有多少属性，就能获取多少值，不需要在页面中显示定义。

对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。快速，准确。
对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。

attr和prop的使用场景：
1.添加属性名称该属性就会生效应该使用prop();
2.是有true,false两个属性使用prop();（如’checked’,’selected’,’disabled’等）
3.其他则使用attr();

(1) 父页面取子页面的值：

top.moreFunLayer = top.layer.open({
               type: 2,
               title: "常用功能",
               area: ["600pt", "150pt"],
               content: './workbench/comUseFunc_add.html',
               success: function(layero, index) {
                   // console.log(index);
                   console.log(layero);
                   console.log(layero[0]);
                   console.log(typeof layero[0]);
                   console.log( $(layero[0]).find("#layui-layer-iframe"+index).contents().find("#btn").val() );
                   console.log(layero[0] instanceof jQuery);
                   console.log(layero[0] instanceof HTMLElement);
               }
           });

(2)子页面取父页面的值

$("#btn").click(()=>{
           console.log("子页面button触发");
           $(parent.document.getElementsByClassName("J_iframe")[0]).attr("src");
           console.log( $(parent.document.getElementsByClassName("J_iframe")[0]).contents().find("#div").html() );
       })

1、子页面要是想取父页面中的js数据，可以在页面中设置一个display为none的div元素或者隐藏的输入框。然后把数据赋值给看不见的元素，然后子页面取父页面的元素值。
2、取元素值的时候，中间间隔的有 iframe 元素的话，必须先定位 iframe 元素，然后取 iframe 元素内容，再定位元素。