jquery基础知识二

作者: old帅 | 来源:发表于2017-06-06 21:40 被阅读16次

    心灵鸡汤:

    有志者事竟成 破釜沉舟 百二秦关终破楚

    苦心人天下负 卧薪尝胆 三千越甲可吞吴

    1.1重点内容


    1.1操作form表单

    1.1.1属性操作

    设置属性:

    //第一个参数表示:要设置的属性名称

    //第二个参数表示:该属性名称对应的值

    $(selector).attr(“title”, “传智播客”);

    获取属性:

    //参数为:要获取的属性的名称,改操作会返回指定属性对应的值

    $(selector).attr(“title”);

    此时,返回指定属性的值

    移除属性:

    //参数为:要移除的属性的名称

    $(selector).removeAttr(“title”);

    注意:checked、selected、disabled要使用.prop()方法。

    prop方法通常用来影响DOM元素的动态状态,而不是改变的HTML属性。例如:input和button的disabled特性,以及checkbox的checked特性。

    细节参考:http://api.jquery.com/prop/

    属性操作总结:”()“里面只有一个参数获取值,里面有两个参数,设置属性

    Øval()值操作

    作用:设置或返回表单元素的值,例如:input,select,textarea的值

    //获取匹配元素的值,只匹配第一个元素

    $(selector).val();

    //设置所有匹配到的元素的值

    $(selector).val(“具体值”);

    text()

    作用:设置或获取匹配元素的文本内容

    //获取操作不带参数(注意:这时候会把所有匹配到的元素内容拼接为一个字符串,不同于其他获取操作!)

    $(selector).text();

    //设置操作带参数,参数表示要设置的文本内容

    //如果设置的内容包含html标签(我要动态创建span,这时候行吗?),那么text这个方法会把他们当作文本内容输出,而不会创建元素。这个text()和html()方的主要区别

    $(selector).text(“我是内容”);

    Ø事件绑定(只介绍on)

    1.1.1on方式(最现代的方式,兼容zepto(移动端类似jQuery的一个库),强烈建议使用的方式)(重点)

    jQuery1.7版本后,jQuery用on统一了所有的事件处理的方法

    作用:给匹配的元素绑定事件,包括了上面所有绑定事件方式的优点

    语法:

    //第一个参数:events,绑定事件的名称可以是由空格分隔的多个事件(标准事件或者自定义事件)

    //第二个参数:selector,执行事件的后代元素

    //第三个参数:data,传递给处理函数的数据,事件触发的时候通过event.data来使用

    //第四个参数:handler,事件处理函数

    $(selector).on(events[,selector][,data],handler);

    //表示给$(selector)绑定事件,当必须是它的内部元素span才能执行这个事件

    $(selector).on( "click",“span”, function(){});

    //绑定多个事件

    //表示给$(selector)匹配的元素绑定单击和鼠标进入事件

    $(selector).on(“click mouseenter”, function(){});

    Ø事件解绑

    off解绑on方式绑定的事件(重点)

    //解绑匹配元素的所有事件

    $(selector).off();

    //解绑匹配元素的所有click事件

    $(selector).off(“click”);

    //解绑所有代理的click事件,元素本身的事件不会被解绑

    $(selector).off( “click”, “**” );

    Ø事件触发(用的不多,不在介绍)


    相关文章

      网友评论

        本文标题:jquery基础知识二

        本文链接:https://www.haomeiwen.com/subject/fmpnfxtx.html