JQuery用法及ajax的JQuery写法讲解

本文介绍: JQue ry dom 对象和jquery 对象 d o m对象和jquery对象相互的转换。d o m对象转为jquery jquery对象转为d o m对象选择器基本选择器 id 选择器 class 选择器标签选择器所有选择器组合选择器表单选择器过滤器通用过滤器表单属性过滤器函数 val text attr rem ov e empty append html each each 循环 json 事件 ajaxjQue ry是一款跨主流浏览器的Jav aSc rip t库，封装了Jav aSc rip t 相关方法调用，简化Jav aSc rip t对 HTML DOM操作 d o m

jQue ry是一款跨主流浏览器的Jav aSc rip t库，封装了JavaScri p t 相关方法调用，简化

JavaScri p t对 HTML DOM操作

dom对象
使用 javascript的语法创建的对象叫做dom对象，也就是js对象。

var obj=document.getElementById("txt1");

obj是dom对象，也叫做js对象obj .value ;

jquery对象
使用 jquery 语法表示对象叫做jquery对象，注意: jquery 表示的对象都是数组

var obj = $("txt1 ")

obj就是使用jquery 语法表示的对象。也就是jquery对象。它是一个数组。现在数组中就一个值

&lt;script type="text/javascript"&gt;
	function btnClick(){
		//获取dom对象
		var obj = document.getElementById("btn");
		//使用dom的value属性,获取值
		alert(obj.value)
		//把dom对象转jquery,使用jquery库中的函数
		var obj1 = $(obj);
		//调用jquery中的函数,获取value的值
		alert( obj1.val())
	}
</script&gt;

<script type="text/javascript"&gt;
	function btnClick(){
		//使用jquery的语法,获取页面中的dom对象
		var obj =$(""#txt")[0];
		//从数组中获取下标是0的dom对象
		var obj=$("#txt").get(0);
		//从数组中获取下标是0的dom对象l 
		var num = obj.value;
	}
</ script>

<script type="text/javascript">
	function fun1(){
		var obj = $("#one" ); T
	}
</ script>

<script type="text/javascript">
	function fun1(){
		var obj = $(".one" ); T
	}
</ script>

<script type="text/javascript">
	function fun1(){
		var obj = $("div"); T
	}
</ script>

<script type="text/javascript">
	function fun1(){
		var obj = $("#one,.two,div"); T
	}
</ script>

<input type="text">
<input type="password">
<input type="radio">
<input type="checkbox">
<input type="button">
<input type="file">
<input type="submit">
<input type="reset">

$(":text")选取所有的单行文本框
$(":password")选取所有的密码框
$(":radio")选取所有的单选框
$(":checkbox")选取所有的多选框
$(":button")选取所有的按钮
$(":submit")选取所有的提交按钮
$(":file")选取所有的
$(":reset")选取所有的

$("选择器:first")

$("选择器:last")

$("选择器:eq(数组索引)")

$("选择器:lt(数组索引)")

$("选择器:gt(数组索引)")

$(":text:enabled")

$(":text:disabled"")

$(function(){
	$("#btn1").click(function(){
		var obj= $(" :text:enabled");
		var obj1= $(" :text:disabled");
		//设置jquery数组值所有dom对象的value值
		obj.val("hello");
	})
}

$(":checkbox:checked")

$(function(){
	
	$("#btn2").click(function(){
		//获取选中的checkbox
		var obj = $(":checkbox: checked" );
		for(var i=0;i<obj.length;i++){
		//输出选中的值
			alert($(obj[i]).val())
	})
}

选择器>option:selected

$(选择器).remove():将数组中所有DOM对象及其子对象一并删除

$(选择器).empty():将数组中所有DOM对象的子对象删除

$(选择器).append("")为数组中所有DOM对象添加子对象

<html>
	<span>
		<b>Hellow</b> word
	</span>
</html>

$("#btn4").click(function(){
	alert($("span").text());//Hellow word
	alert($("span").html());//<b>Hellow</b> word
})

$("#btn6").click(function(){
	var arr =[ 11，12，13];
	$.each(arr,function(index, element){
		alert(index + "数组成员:"+element);
	}
})

var json={ "name":"张三","age" :18};
$.each(json,function(i,n){
	alert(i+"=="+n);
})
结果：
1==张三
2==18

语法:$(选择器).on(event,function)

$("#newBtn" ).on("click",function(){
	alert("hello");
})

$.ajax({
	url : "queryjson",
	data:{
		"参数名" : 参数
	},
	dataType: "json",
	success:function (resp){
		响应事件
	}
})

显示所有内容

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。

JQue ry

dom对象和jquery对象

dom对象和jquery对象相互的转换。

dom对象转为jquery

jquery对象转为dom对象

选择器

基本选择器

id选择器

class选择器

标签选择器

所有选择器

组合选择器

表单选择器

过滤器

通用过滤器

表单 属性 过滤器

函数

val

text

attr

rem ove

empty

append

html

each

each 循环 json

事件

ajax

发表回复取消回复

JQuery