JQuery基础

最新推荐文章于 2023-06-11 13:49:24 发布

wlwhong

最新推荐文章于 2023-06-11 13:49:24 发布

阅读量438

点赞数

文章标签： intellij-idea javascript java

本文链接：https://blog.csdn.net/wlwhong/article/details/121785516

版权

日期：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需要导包

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="jquery-3.3.1.min.js"></script>//JQuery包
</head>

总结

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

wlwhong

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQuery基础

日期：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
复制链接

扫一扫