jQuery的复习(二)：函数和Ajax

最新推荐文章于 2024-06-12 15:03:21 发布

BKSW.

最新推荐文章于 2024-06-12 15:03:21 发布

阅读量904

点赞数

分类专栏： javaweb 前端学习文章标签： jquery ajax javascript 前端

本文链接：https://blog.csdn.net/weixin_51276056/article/details/123469675

版权

jQuery的复习(二)：函数和Ajax

笔记总结自：jQuery入门到精通全套完整版(jQuery2020最新版本)Web前端jQuery初学者零基础学习

函数

第一组函数

1. val

操作数组中Dom对象的value属性。

$(选择器).val():无参数调用形式，读取数组中第一个dom对象的value属性值
$(选择器).val(值)：有参数形式，对数组中所有的dom对象的value值进行统一赋值

2. text

操作数组中所有的Dom对象的【文字显示内容属性】

$(选择器).text():无参数调用，读取数组中所有Dom对象的文字显示内容，将得到的内容拼接成一个字符串返回
$(选择器).text(值):有参数方式，对数组中所哟dom对象的文字显示内容进行统一赋值

3. attr

对val和text之外的属性进行操作

$(选择器).attr("属性名")：获取dom数组第一个对象的属性值
$(选择器).attr("属性名","值")：对数组中的所有dom对象的属性设置新值

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>函数的使用</title>
		<style type="text/css">
		div{
    
			background-color: skyblue;
		}
		</style>
		<script type="text/javascript" src="js/jquery-3.6.0.js"></script>
		<script type="text/javascript">
		$(function(){
    
			$("#btn1").click(function(){
    
				//获取第一个文本框的值
				var text = $(":text").val();
				alert(text);
				
				//获取所有文本框的值
				var obj = $(":text");
				for(var i = 0;i<obj.length;i++){
    
					var dom = obj[i];
					alert(dom.value);
					alert("jquery:"+$(dom).val())
				}
			})
			$("#btn2").click(function(){
    
				//设置可以设置的文本框的值
				$(":text:enabled").val("三国演义");
			})
			$("#btn3").click(function(){
    
				//获取div，的文本值连接成一个字符串返回
				alert($("div").text());
			})
			$("#btn4").click(function(){
    
				//改变第三个div的文本值
				//注意下标从0开始
				$("div:eq(2)").text("我被改变了");
			})
			$("#btn5").click(function(){
    
				//获取src属性值
				var src = $("img").attr("src");
				alert(src);
			})
			$("#btn6").click(function(){
    
				//设置指定属性值
				$("img").attr("src","img/mmexport1645427534230.jpg");
			})
		})
		</script>
	</head>
	<body>
		<input type="text" value="刘备" disabled="true"/><br />
		<input type="text" value="关羽" /><br />
		<input type="text" value="张飞" /><br />
		<br>
		<div >我是第一个div</div>
		<div >我是第二个div</div>
		<div >我是第三个div</div>
		<br>
		<img src="img/mmexport1645266536229.jpg" width="100px" id="imgage1" height="60px"/>
		<br>
		<p>功能按键</p>
		<input type="button"  value="获取第一个文本框的值" id="btn1"/><br>
		<input type="button"  value="设置可以设置文本框的value值" id="btn2"/><br>
		<input type="button"  value="获取div所有文本值" id="btn3"

最低0.47元/天解锁文章

BKSW.

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jQuery的复习(二)：函数和Ajax

jQuery的复习(二)：函数和Ajax笔记总结自：jQuery入门到精通全套完整版(jQuery2020最新版本)Web前端jQuery初学者零基础学习函数第一组函数1. val操作数组中Dom对象的value属性。$(选择器).val():无参数调用形式，读取数组中第一个dom对象的value属性值$(选择器).val(值)：有参数形式，对数组中所有的dom对象的value值进行统一赋值 2. text操作数组中所有的Dom对象的【文字显示内容属性】$(选择器).text():无参
复制链接

扫一扫