学习JQuery中文文档之get()函数
2024-09-29 04:03:02
前端大神群的群主告诉我们:学习一个框架最好的方法是去把官方文档研究一遍。
现在正式开始我的前端之路,从JQuery的中文文档开始。
基础不牢固,看起来有点慢,但是我会一直坚持下去的。把遇到的问题都记录在此,以便随时查阅。
不展示基础概述,只记录所遇问题。
Just Do It! Never Give Up!
get()函数
看完这个函数的定义,我就兴冲冲的去试验了一下,写了以下代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>get()</title>
<style type="text/css">
div{width:100px; height:100px; margin:20px; background:#e5e5e5;}
</style>
<script src="js/jquery-1.11.3.min.js"></script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<script type="text/javascript">
$(function(){
$("div").get(2).css("background","#f00");
});
</script>
</body>
</html>
运行了一下,本来设想的结果应该是第三个div块的背景颜色变为红色,但是天不遂人愿,所有的div块都没有反应。
我就傻眼了!
再寻求了度娘无果之后,再次认真看文档,才发现问题出在何处。
get()能让你选择一个实际的DOM元素并对他进行操作。
反复研究之后(基础太差伤不起),因为get()返回的是JS对象,不是JQuery对象,所以不能使用Jquery中的css()方法。
所以,我把函数改成这个样子再试一次:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>get()</title>
<style type="text/css">
div{width:100px; height:100px; margin:20px; background:#e5e5e5;}
</style>
<script src="js/jquery-1.11.3.min.js"></script>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<script type="text/javascript">
$(function(){
$($("div").get(2)).css("background","#f00");
$("div").get(0).style.background="red";
//get()获取的是DOM对象,不能使用JQuery的方法
});
</script>
</body>
</html>
这次第一个和第三个div就爽爽快快的变成红色了。喜庆啊!
之前之所以会产生问题,就是因为我没有搞清函数返回的对象的类型,使用错了方法。
在此也提醒自己,在学习的时候,一定要注意遇到问题不可怕,不思考才最可怕,而且一定要从基础由下而上的思考。不要盲目百度,浪费时间,还云里雾里。
只要一个开始,坚持到底……
最新文章
- WebService技术(一)
- JQM页面跳转,多种效果
- iOS学习笔记(5)— UITextField
- install kinect driver for ARM---38
- 二十四种设计模式:装饰模式(Decorator Pattern)
- VS2010打开就自动关闭问题解决
- SQL Server 中 RAISERROR 的用法(转)
- JSON连载java目的
- linq 在查询表达式中处理异常
- React项目模板-从项目搭建到部署
- echarts图表变形解决方案
- FastDFS 与 Nginx 实现分布式图片服务器
- Individual Project
- 【mysql】删除字段的最后一个字符
- Docker-Compose 安装
- python --- 22 初始模块 random time collections functools
- python-day76--django-Form组件
- OpenCV (C++) 几何形状识别(面积过滤、横纵比过滤等等)
- Spring AOP的日志记录
- Oracle之表空间
热门文章
- JS面向对象组件(二)--Javascript原型链
- 字符串string
- linux ubuntu 安装jdk
- linearlayout 水平垂直居中
- WebAPI初探
- [讲座]【项目收集】&ldquo;清流资本&rdquo;互联网金融沙龙&mdash;&mdash;颠覆者的创新与机会
- Locker
- org.unsaved transient instance - save the transient instance before flushing: bug解决方案
- Android百度地图开发(四)线路搜索
- 对于cocos2d-x lua的防护措施