JQuery初级入门

6 篇文章 0 订阅

jQuery简介
jQuery相当于将JavaScript封装好了,可以拿来直接用,强调写的更少,做的更多,但因为是封装好的半成品,有很多东西可能用不到,也突出了效率低的缺点

JavaScriptDOM取得的是一个对象
jQuery取得的是一个集合
JavaScript使用属性操作页面属性
jQuery使用方法操作页面属性

转换
jQuery转为DOM对象 $(“p”)[0]
DOM转为jQuery对象 $(DOM对象)

jQuery常用方法
注意点:使用jQuery时一定要导包,若使用js,且要在引用js前导包

页面加载完才执行方法

$(function () {

});

通过ID选择器获取标签名

<span id="a">我是文本</span>
<script type="text/javascript">
	$(function () {
		var a=$("#a")[0].tagName;
		alert(a);
	});
</script>

类选择器

$(".aa");

标签选择器

$("span")

取得文本框value

<script type="text/javascript">
	$(function () {
		var a=$("#aa").val();
		alert(a);
	});
</script>

给文本框赋值

<input id="aa" type="text" value="kkk">
<script type="text/javascript">
	$(function () {
		var a=$("#aa").val("bbb");
	});
</script>

总结:操作文本可用text()方法,
操作css可用css()方法,
操作其他属性可用attr()方法,
无参数为取值,有参数为赋值,
若为多个值可用(“属性名”:“属性值”,“属性名”:“属性值”)

jQuery事件
实例:

<input id="a" type="button" value="按钮">
<script type="text/javascript">
	$(function () {
		$("#a").bind("click",function () {
			alert("成功触发事件");
		});
	});
</script>
<span id="a">文字</span>
<script type="text/javascript">
	$(function () {
		$("#a").hover(function () {
			$(this).css("color","red");
		},function () {
			$(this).css("color","blue");
		});
	});
</script>

submit提交事件
bind多次性可触发事件
one一次性触发事件
hover鼠标滑过事件
toggle多个事件

常用jQuery选择器
实例:
$(“span”:first)选中第一个
基本选择器
last选中最后一个
not排除什么
even选中偶数位,从下标0开始计数
odd选中奇数位
根据文字内容选择器
jQuery.contains(document.documentElement, document.body)
过滤选择器
$(“div”).children(".selected")
属性选择器
$(“input[type=button]”)

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值