目录

基础知识

选择器

事件绑定

DOM操作

拓展

总结

日期：2021年12月7日

出处：黑马程序员JavaWeb全套教程，Java Web从基础到项目实战（IDEA版）

黑马程序员JavaWeb全套基础教程，java web从入门到项目实战（IDEA版javaweb）_哔哩哔哩_bilibili

基础知识

是一个JS框架

优化DOM操作

JQuery对象和JS对象方法不通用

需要相互转换：

jq -- > js : jq对象[索引] 或者 jq对象.get(索引)

js -- > jq : $(js对象)

// JS转JQ
        var div22 = document.getElementById("div2");
        alert(div22);
        var $div22 = $("div22");
        alert($div22)

// JQ转JS
        var div1 = $("#div1");
        div1[0].innerHTML = "ddd";
        // alert(div1.html());

        var div2 = $("#div2");
        alert(div2.html());
        var $div = $("div");
        // $div[0].innerHTML = "eee";
        $div.get(0).innerHTML = "eee"

选择器

筛选具有相似特征的元素(标签)

事件绑定

JS写法：window.onload = function{}

JQ写法：$(function){}

区别：

window.onload =function{} 只能定义一次，如果定义多次，后边的会将前边的覆盖掉

$(function) 可以定义多次的，不会对前面的内容产生影响

DOM操作

通用属性操作

• attr(): 获取/设置元素的属性
• removeAttr():删除属性

• prop():获取/设置元素的属性
• removeProp():删除属性

attr和prop区别？

• 如果操作的是元素的固有属性，则建议使用 prop
• 如果操作的是元素自定义的属性，则建议使用 attr

拓展

注意：JQuery需要导包

    
    
    //JQuery包

总结

---

今天学习了JQuery的基础知识，包括基础语法，选择器，DOM操作，在基础操作中对比了JS语法，其中重点是事件绑定的不同，JS的事件绑定window.onload =function{} 只能定义一次，如果定义多次，后边的会将前边的覆盖掉，JQ的入口函数不会对前面的内容有任何影响，之后在选择器和DOM操作中的知识是JQuery特有方法，简化代码，内容很多，记忆量大，但好理解；JQuery极大地所见了相同操作下的代码量，要时刻明确操作的对象是JS对象还是JQ对象，之后直接根据需求调用对应的方法即可