前端大神群的群主告诉我们:学习一个框架最好的方法是去把官方文档研究一遍。

现在正式开始我的前端之路,从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就爽爽快快的变成红色了。喜庆啊!

之前之所以会产生问题,就是因为我没有搞清函数返回的对象的类型,使用错了方法。

在此也提醒自己,在学习的时候,一定要注意遇到问题不可怕,不思考才最可怕,而且一定要从基础由下而上的思考。不要盲目百度,浪费时间,还云里雾里。

只要一个开始,坚持到底……

学习JQuery中文文档之get()函数的更多相关文章

  1. 学习JQuery中文文档之map()函数和get()函数

    今天学到一个新的函数map(). map(callback) 官方概述: 将一组元素转换成其他数组(不论是否是元素数组) 你可以用这个函数来建立一个列表,不论是值.属性还是CSS样式,或者其他特别形式 ...

  2. 学习JQuery中文文档之index()函数

    最初认识index()是在轮播图中,获取当前点击对象在数组中的位置.那时候,对index()的使用只有eq($(this).index()),看了文档之后,才知道自己有多幼稚! <!DOCTYP ...

  3. java冒泡排序-选择排序-插入排序-使用API中文文档直接调用函数

    import java.util.Arrays; public class ArrayDemo2_3 { public static void main(String []args) { //---- ...

  4. (十)unity4.6学习Ugui中文文档-------參考-UGUI Canvas Components

     大家好,我是孙广东.   转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:http://www.unit ...

  5. (二十二)unity4.6学习Ugui中文文档-------交互-Eventsystem &amp; Binding

    大家好,我是孙广东.   转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:http://www.unityma ...

  6. unity4.6学习Ugui中文文档-------参考-UGUI Rect Transform

    1 . Rect Transform Rect Transform 是 2D 与 3D 图形的 Transform 组件对应.它用来指定用户界面系统中的大小. 位置和旋转的控件 Properties ...

  7. (二十一)unity4.6学习Ugui中文文档-------交互-Supported Events &amp; Raycasters

    大家好,我是孙广东. 转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:mod=guide&view=m ...

  8. (九)unity4.6学习Ugui中文文档-------參考-UGUI Rect Transform

     大家好.我是孙广东.   转载请注明出处:http://write.blog.csdn.net/postedit/38922399 更全的内容请看我的游戏蛮牛地址:http://www.unit ...

  9. jQuery中文文档

    http://www.jquery123.com/ http://www.shifone.cc/

随机推荐

  1. XSS 前端防火墙(2):可疑模块拦截

    由于是在前端防护,策略配置都能在源代码里找到,因此很快就能试出破解方案.并且攻击者可以屏蔽日志接口,在自己电脑上永不发出报警信息,保证测试时不会被发现. 昨天提到最简单并且最常见的 XSS 代码,就是 ...

  2. XposedNoRebootModuleSample 不需要频繁重启调试的Xposed 模块源码例子

    XposedNoRebootModuleSample(不需要频繁重启调试的Xposed 模块源码例子) Xposed Module Sample No Need To Reboot When Debu ...

  3. 高效使用STL

    高效使用STL  参考:http://blog.jobbole.com/99115/ 仅仅是个选择的问题,都是STL,可能写出来的效率相差几倍:熟悉以下条款,高效的使用STL: 当对象很大时,建立指针 ...

  4. c/c++工程中外部头文件及库添加方法

    在VS工程中,添加c/c++工程中外部头文件及库的基本步骤: 1.添加工程的头文件目录:工程---属性---配置属性---c/c++---常规---附加包含目录:加上头文件存放目录. 2.添加文件引用 ...

  5. VS2010安装EntityFramework5.0

    EntityFramework 当前最新版本是6.0,2012年10月份发布,不过是alpha1版本,稳定版本是8月份发布的5.0版本,对于初学者来说,还是别在测试版上折腾了,先学习稳定的5.0版本, ...

  6. Camera拍照声设定

    在某些国家(比如Japan),为了防止偷拍,强制拍照声是需要从Speaker出来的(即使插入耳机的情况下). 实现该功能比较简单的方法就是将拍照声类型设置为Ringtone 或 Alarm 或 Not ...

  7. NSRangeFromString 测试

    官网文档 Returns a range from a textual representation. Declaration SWIFT func NSRangeFromString(_ aStri ...

  8. docker集成管理工具-shipyard的开发环境搭建笔记

    前段时间一直在研究openstack,后来老师告诉我需要用docker容器来搭建hadoop集群,所以就将战场转移到docker上来了,话说docker最近这段时间太火了,但是说实话我觉得应用起来还不 ...

  9. 使用bat快速创建cocos2d-x模板

    在上一篇文章中我们学习了如何使用python创建cocos2d-x 2.2工程,但是每次我们都输入一大串的命令,好烦好烦啊.参考别人的文章这里写了一个bat,如下 @echo off echo --- ...

  10. LDR指令的格式:

    http://blog.csdn.net/tanyouliang/article/details/6767011 LDR指令的格式: LDR{条件}   目的寄存器     <存储器地址> ...