喜迎
春节

jQuery


jQuery 语法

jQuery 语法是通过选取 HTML 元素,并对选取的元素执行某些操作。
基础语法: $(selector).action()

美元符号定义 jQuery

选择符(selector)”查询”和”查找” HTML 元素
jQuery 的 action() 执行对元素的操作
jQuery 中所有选择器都以美元符号开头:$()

文档就绪事件

$(document).ready(function(){

// 开始写 jQuery 代码…

});

简洁写法(与以上写法效果相同):
$(function(){

// 开始写 jQuery 代码…

});
这是为了防止文档在完全加载(就绪)之前运行 jQuery 代码,即在 DOM 加载完成后才可以对 DOM 进行操作

    <div>123</div>
    <div class="div1">456</div>
    <div id="div2">789</div>
    <p class="p1">qeq</p>
    <p>xxx</p>
    <ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
    </ul>
    <script>
        var div = $("div");
        console.log(div);   
        // console.log(jQuery);
        console.log($("div").eq(1));//选择第一个div
        console.log($("div:eq(2)"));//选择第二个div
        //:eq     匹配一个给定索引值的元素,单个元素

        console.log($("div").html());//div的内容
        console.log($("*"));//查找所有的元素
        console.log($(this));//选取当前的HTML元素
        console.log($("p.p1"));//选择class="p1"的p标签
        console.log($("p:first"));//选择第一个p标签
        console.log($("ul li:first"));//选择ul下的第一个li
        $("p:first").dblclick(function(){
            alert("双击!");
        })
        console.log($("div")[0]);//转换为原生js
        console.log($("div").get(0));转换为原生js
        $("div").eq(1).html("我QQ(#`O′)").addClass("box1").css("color","red");
        var div2 = document.querySelector("#div2");
        console.log($("div2"));//转换为jQuery
        console.log($("ul").children(".two"));//ul下class="two"的li
        console.log($("ul").find(".two"));//ul下的class="two"的所有元素
    </script>

1.jQuery选择器

2.jQuery事件


文章作者: NekoDeng
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 NekoDeng !
评 论
  目录