jquery知识小结

最新推荐文章于 2022-09-16 16:03:29 发布

fly102020

最新推荐文章于 2022-09-16 16:03:29 发布

阅读量241

点赞数

分类专栏：知识总结文章标签： jquery

本文链接：https://blog.csdn.net/fly102020/article/details/51565072

版权

知识总结专栏收录该内容

1 篇文章 0 订阅

订阅专栏

jQuery
什么是jQuery?
是一个javaScript框架,一个轻量级的js库;
要使用jQuery首先要引入jQuery文件
<script type="text/html;charset=utf-8" src="具体的文件路径"></script>

jQueryday01:
==获取css: $("p").css("font-size");获取字体
设置字体:$("p").css("font-size",14+"px");
添加样式: .addClass("类名");
去除样式: .removeClass("类名");
document.getElementsByTagName("p"); //返回的是一个数组
==将字符串转换成数字: parseInt(合法字符串);

== var ps = $("p"); //返回的是数组,DOM对象
== //ps[i]和ps.get(i)等价；
//ps[i]是js默认的获取数组元素的方式；
//ps.get(i)是jQuery封装的方法；
//这2种方式返回的都是DOM对象(js对象)，
//而不是jQuery对象，所以不能通过这个
//对象直接调用jQuery的方法；

== <img src="../images/01.jpg" οnclick="f2(this)"/>
注: 其中的οnclick="f2(this)"; this: 代表被点击的对象;

<body οnlοad="start();"> 
==定时器
setInterval(function(){},1000); //每隔一秒执行的操作

==//页面载入完毕以后开始执行
$(function(){});

==this是js对象
==$(this),将this转换成了jQuery对象
== var $li = $(this).parents("li"); 快去弄明白
== var tds = $(btn).parent().siblings(); //找到btn的父亲的所有兄弟,但是没有包含自己哟
<--插入元素-->
== .prepend($tr) 作为父亲第一个儿子添加(添加的是jQuery对象)
== .append($tr) 作为父亲最后一个儿子添加(添加的是jQuery对象)

<--获取元素-->
== .eq(i) //是获取第i个元素,返回的是jQuery对象;
== .prev() //获取哥哥
== .next() //获取弟弟
== .siblings() //获取所有的兄弟,但是不包括自己
== .children() //获取所有的孩子;
== .children("ul.tA_choseTime"); //获取指定的孩子:(获取class为tA_choseTime的ul)
== .last(); //获取最后元素
== .val() //获取<input/> 中的值
.val(内容) //设置值
== .text() //获取标签中的文本;
.text(内容) //给标签设置文本
== .html() //获取标签中的所有内容,包括其他标签
.html(内容) //给标签设置内容

== var bookId = $("#replaySelect option:selected").val(); //获取<option></option>中的value

== .empty() //将内容清空
== .remove() //删除自己
例子: 清空<ul id="u1"><li></li><ul>中的内容
方法1: $("#u1").empty(); //直接清空<ul>的内容
方法2: $("#u1 li").remove(); //获取其中所有的<li>,将其删除;

<--事件-->
== $("#s1").change(function(){}) //改变事件
var $option = $("#s1 option:selected"); //获取<select id="s1"> 中被选中的option;
== $("#s1").click(function(){}) //单击事件
//给id="note_list"的<ul>上,动态产生的<li>添加事件
== $("#note_list").on("click","li",function(){}); //绑定单击事件
== $("#note_list").on("mouseout","li",function(){}); //绑定鼠标移出事件
== $("#note_list").on("mouseover","li",function(){}}; //绑定鼠标移入事件