[学习笔记]什么是JQuery?
来源:互联网 发布:阿里云服务器配置l2tp 编辑:程序博客网 时间:2024/04/29 23:24
一、什么是JQuery?
Jquery是javascript库,极大的简化了javascript编程,核心理念是write less,do more(写得更少,做得更多)。它提供API让开发者编写插件,制作动画、事件处理、使用AJAX等,让开发者轻松的开发出功能强大的静态或动态网页。
二、JQuery语法
JQuery语法是为HTMl元素的选取编制的,可以对元素执行某些操作:
基础语法:$(selector).action();
1.美元符号定义JQuery
2.选择符(selector)“查询”和“查找”html元素
3.action()执行对元素的操作
三、JQuery HTML
JQuery拥有可操作html元素和属性的强大方法
1.获取或设置内容
a.text()设置或返回所选元素的文本内容
b.html() - 设置或返回所选元素的内容(包括 HTML 标记)
c.val() - 设置或返回表单字段的值
实例1:
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("#btn1").click(function(){
alert("Text: " + $("#test").text());//获取text文本内容
alert("HTML: " + $("#test").html());//获取html元素内容
alert("Value: " + $("#test").val());//获取表单字段值
});
实例2:
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("#btn1").click(function(){ //id为btn1的元素执行click时间
$("#test1").text("Hello world!"); //设置text值
$("#test2").html("<b>Hello world!</b>"); //设置元素内容
$("#test3").val("Dolly Duck");//设置表单字段值
});
2.设置或返回元素的样式
实例1:返回指定元素的css值
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css("background-color");//获取背景颜色
实例2:设置指定css属性
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css("background-color","yellow") //设置背景色为黄色
实例3:设置多个css属性
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css({"background-color":"yellow","font-size":"200%"});
四、JQuery常用事件
1.click()执行点击事件
2.$(document).ready(function{})定义页面装在完成时,需要执行的方法
Jquery是javascript库,极大的简化了javascript编程,核心理念是write less,do more(写得更少,做得更多)。它提供API让开发者编写插件,制作动画、事件处理、使用AJAX等,让开发者轻松的开发出功能强大的静态或动态网页。
二、JQuery语法
JQuery语法是为HTMl元素的选取编制的,可以对元素执行某些操作:
基础语法:$(selector).action();
1.美元符号定义JQuery
2.选择符(selector)“查询”和“查找”html元素
3.action()执行对元素的操作
三、JQuery HTML
JQuery拥有可操作html元素和属性的强大方法
1.获取或设置内容
a.text()设置或返回所选元素的文本内容
b.html() - 设置或返回所选元素的内容(包括 HTML 标记)
c.val() - 设置或返回表单字段的值
实例1:
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("#btn1").click(function(){
alert("Text: " + $("#test").text());//获取text文本内容
alert("HTML: " + $("#test").html());//获取html元素内容
alert("Value: " + $("#test").val());//获取表单字段值
});
实例2:
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("#btn1").click(function(){ //id为btn1的元素执行click时间
$("#test1").text("Hello world!"); //设置text值
$("#test2").html("<b>Hello world!</b>"); //设置元素内容
$("#test3").val("Dolly Duck");//设置表单字段值
});
2.设置或返回元素的样式
实例1:返回指定元素的css值
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css("background-color");//获取背景颜色
实例2:设置指定css属性
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css("background-color","yellow") //设置背景色为黄色
实例3:设置多个css属性
[html] view plain copy print?在CODE上查看代码片派生到我的代码片
$("p").css({"background-color":"yellow","font-size":"200%"});
四、JQuery常用事件
1.click()执行点击事件
2.$(document).ready(function{})定义页面装在完成时,需要执行的方法
0 0
- [学习笔记]什么是JQuery?
- [学习笔记]什么是索引?
- 学习笔记 什么是GPIO?
- 什么是jQuery?为什么要学习jQuery?
- 学习笔记:什么是设计模式?
- SharpDevelop学习笔记--什么是Addin
- ajax学习笔记---什么是Ajax
- Spring学习笔记 什么是AOP
- Linux学习笔记:什么是x86
- EventBus学习笔记-什么是EventBus
- [学习笔记]什么是存储过程?
- Spark学习笔记 --- 什么是RDD
- java学习笔记-什么是接口
- 【JavaScript学习笔记】什么是NodeJs?
- 王一三学习笔记 | 什么是J2EE
- 【学习笔记】JQuery学习笔记
- jQuery 学习笔记 + jQuery-UI 学习笔记
- 【jQuery 学习笔记】初识jQuery
- 摄像头自动对焦
- [学习笔记]什么是索引?
- HashMap的实现原理
- [学习笔记]利用Jquery实现一些动态效果
- iOS图片拉伸填充背景
- [学习笔记]什么是JQuery?
- 以换换圈作为研究对象的数据字典
- Android UI高级之Notification
- java中的equals()和hashcode()方法总结
- [学习笔记]XMLHttpRequest实现局部刷新
- [Simpson积分] BZOJ 1502 [NOI2005]月下柠檬树
- [学习笔记]easyui 为表格行添加事件
- 人人,金山西山居,腾讯互娱,微信,网易游戏offer及面经
- [学习笔记]zTree是一个很好的js插件实现加载树形结构