是时候复习一下jQuery了

野性酷女 2023-02-17 06:27 57阅读 0赞

本次复习的内容：

*  jQuery中如何获取对象
 *  jQuery中如何设置对象样式
 *  jQuery中如何设置class名相同的对象的样式  
    css代码部分：

<style type="text/css">
    		#one{ 
    			width: 300px;
    			height: 300px;
    			background-color: red;
    			font-size: 100px;
    		}
    		.two{ 
    			font-size: 30px;
    			color: red;
    		}
    	</style>

html代码部分：

<div id="one">one</div>
    		<div class="two">1</div>
    		<div class="two">2</div>
    		<div class="two">3</div>
    		<div class="two">4</div>
    		<input type="text" id="inp">

js代码部分：

<script type="text/javascript">
    		// jQuery是一个快速,小巧,功能丰富的JavaScript库,是对原生JS的封装;
    		// 原生JS中,
    		var oneDiv = document.getElementById("one");
    		oneDiv.style.color = "white";
    		//JQ中,使用 jQuery(选择器或者对象) jQuey简写成$ 获取该标签元素对象
    	    // jQuery("#one") 
    		$("#one").css("color","yellow");
    		// $("#one").style.color = "blue"; //错误
    		// oneDiv.css("color","pink"); //错误
    		$(oneDiv).css("color","green");//正确
    		//2.html()方法,相当于JS中的innerHTML 
    		$("#one").html("云松");
    		$("#one").html("<a href='###'>百度</a>");
    		// 3.text() ---- JS中的 innerText
    		$("#one").text("<a href='###'>百度</a>");
    		var a = $("#one");
    		a.css("width","800px");
    		//为所有的class名 为two设置样式
    		$(".two").css("color","yellow");
    		
    		$(".two").css("font-size",function (i,v){ 
    			// console.log(i);
    			// console.log(v);
    			return (i + 1) * 30 + "px";
    		});
    		
    		
    // 第一个参数:i 返回JQ对象div所在的下标,
    // 第二个参数:v 之前对象对应的属性值;
    		var arrName = ["佳豪","财源","梦珂","丹依"];
    		$(".two").html(function (i,v){ 
    			return arrName[i];
    		});
    		
    		//设置输入框的value值 
    		$("#inp").val("张斌");
    		// 取值
    		$("#inp").val();
    		
            		
    	</script>

发表评论取消回复

表情：

评论列表（有 0 条评论，57人围观）

还没有评论，来说两句吧...

相关阅读

相关是时候深入了解JVM了

刚开始接触Java时，对JVM是无知的，确实，是无感知的。因为Java的设计者，为了降低语言的复杂度，屏蔽实现细节，将很多背后的操作"隐藏"了。在很长时间里，不需要了解Ja

太过爱你忘了你带给我的痛/ 2023年06月22日 04:26/ 0 赞/ 25 阅读

相关好久不用 jQuery，来复习一下

1.1 简介 1.1.1 概述 jQuery 是一个优秀的 JavaScript 库，是一个由 JohnResig 创建于 2006 年 1 月的开源项目。现在

傷城~/ 2023年02月20日 06:16/ 0 赞/ 182 阅读

相关是时候复习一下jQuery了

本次复习的内容： jQuery中如何获取对象 jQuery中如何设置对象样式 jQuery中如何设置class名相同的对象的样式 css代码部分

野性酷女/ 2023年02月17日 06:27/ 0 赞/ 58 阅读

相关是时候学习Linux了

前言： Linux是一个开源、免费的操作系统。其稳定性、安全性、处理多并发已经得到业界的认可，目前很多企业级的项目都会部署到Linux/unix系统上。如果你还不太了解Lin

绝地灬酷狼/ 2023年02月14日 10:29/ 0 赞/ 30 阅读

相关是时候复习下 Webpack 了

点击上方关注前端技术江湖，一起学习，天天进步 ![13e72a6b2b9ccadbaa711260f2dd9d57.png][] 一直以为，我的`Webpack`就是复制

悠悠/ 2022年09月13日 13:28/ 0 赞/ 270 阅读

相关复习一下Kafka

一、前言前几天看了一篇《打造全球最大规模Kafka集群，UBER的多区域灾备实践》的一篇博客，Uber用kafka实践，每天处理数亿级消息和几个PB的数据，kafka现

桃扇骨/ 2022年08月30日 01:45/ 0 赞/ 189 阅读

相关该是回归的时候了

离开了这个微博很久久到发生了很多很多的事情生了个孩子，现在快9个月了换了个工作，已经到新公司1个月了原来只是颗螺丝钉，现在什么都要自己亲力亲为嗯，失眠好了，

缺乏、安全感/ 2022年06月10日 08:13/ 0 赞/ 338 阅读

相关是时候了解下 nacos 了！

点击上方牧码小子，选择置顶或者星标原创技术干货每日送达！本文由读者 muggle 投稿，muggle 是一位具备极客精神的 90 后单身老实猿，对技术有着狂热追求。mug

分手后的思念是犯贱/ 2021年10月15日 12:59/ 0 赞/ 480 阅读

相关你知道多态的实现机制吗?是时候好好回顾一下了！

你知道多态的实现机制吗?是时候好好回顾一下了！ > Java面向对象的三大特征是封装，继承和多态，这里面我觉得比较难理解的应当属于多态了，而且多态也是一个经常被考查的问题

亦凉/ 2021年09月16日 04:58/ 0 赞/ 229 阅读

相关是时候了解一下 Java 8 新增的函数式接口 Predicate 了

Predicate 是 Java 8 新增的一个函数式接口（通过 `@FunctionalInterface` 注解定义），因此可以将一个 [Lambda 表达式][Lambd

阳光穿透心脏的1/2处/ 2021年08月10日 15:30/ 0 赞/ 320 阅读