Nearth===>WEB前端--第21课/JQuery/链式编程1（基本使用方法以及断链）

最新推荐文章于 2023-08-15 22:16:10 发布

码字界陈冠希

最新推荐文章于 2023-08-15 22:16:10 发布

阅读量156

点赞数

分类专栏： WEB前端第三季/JQuery

本文链接：https://blog.csdn.net/ly1716/article/details/103055932

版权

WEB前端第三季/JQuery 专栏收录该内容

52 篇文章 0 订阅

订阅专栏

链式编程：

var obj=$("#dv").css("backgroundColor","red").html("<p>这是一个改变了的p</p>");

断链：

var obj=$("#dv").html().css("backgroundColor","red");//断链
console.log(obj);//报错

代码学习：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Nearth</title>
		<script src="jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
	    <style type="text/css">
	    	div{
				width:200px;
				height: 200px;
				background-color: aquamarine;
			}
	    </style>
		<script type="text/javascript">
			//要求,页面中有一个按钮,还有一个div,点击按钮的时候,让div中添加一个p 标签,并显示内容
			//点击按钮的同时修改div 的背景颜色
			//链式编程:对象.方法().方法().方法();·····
			$(function(){
				$("#btn").click(function(){
					/* $("#dv").html("<p>这是一个改变了的p</p>");
					$("#dv").css("backgroundColor","red");//没有使用链式编程 */
					/* $("#dv").html("<p>这是一个改变了的p</p>").css("backgroundColor","red")  ;
					//使用了链式编程 */
					var obj=$("#dv").css("backgroundColor","red").html("<p>这是一个改变了的p</p>");//第二种写法
					/* var obj=$("#dv").html().css("backgroundColor","red");//断链 
					console.log(obj);//报错
					*/	
				})
			})
		</script>
	</head>
	<body>
		<h1>链式编程</h1>
		<hr >
		<input type="button" name="" id="btn" value="显示效果" />
		<div id="dv">
        <p>这是一个p</p>			
		</div>
	</body>
</html>

注意：运行结果也就那样······没什么好看的···顺便想偷个懒··········哈哈哈···········

休息了几天也该学习了··········舒服···························

码字界陈冠希

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
Nearth===>WEB前端--第21课/JQuery/链式编程1（基本使用方法以及断链）

链式编程：var obj=$("#dv").css("backgroundColor","red").html("<p>这是一个改变了的p</p>");断链：var obj=$("#dv").html().css("backgroundColor","red");//断链 console.log(obj);//报错代码学习：<!DOCTY...
复制链接

扫一扫