一、数据类型判断与种类

例子：

 var a = 100;           //定义了一个变量a，并且赋值100

 var b = true;

 var c = "hello";

 var d = 'k';

 var e = 3.14

 console.log(typeof a);//输出a变量的类型，number

 console.log(typeof b);//boolean

 console.log(typeof c);//string

 console.log(typeof d);//string

 console.log(typeof e);//number

 console.log(typeof xyz);//undefined


二、运算及数据类型转换

例子

Math.floor(5/3);//取整

Math.sqrt(81);//开方

Math.pow(3,2);//3的平方

parseInt(“534”);//字符串转整数

parseInt(“一年356天”);//字符串转整数，带自动过滤

parseInt(“3.64”);//结果为3，取整，不是四舍五入

parseFloat("3.45");//字符串转小数


三、JS面向对象

3.1 对象的创建

    1) var obj1={};

    2) var obj2=new object();

    3) var obj3=object.create();

    推荐使用第一种方式，第二种方式存在效率问题。因为new对象，会涉及到原型查找的问题。


3.2 函数也是对象

    有双重身份，1.对象；2.构造函数；（类）


四、代码执行特性

4.1 eval函数，直接执行代码段。

   var exe="alert('hello')";

   eval(exe);


4.2 JS 的函数没有重载特性



=====================================================================

JQ易忘知识整理


一、启动

<script type="text/javascript" src="jquery.min.js"></script>

$(document).ready(function(){});

$(function(){});

JS的window.onload事件是等到所有内容以及外部的图片加载完之后，才去执行。

jQuery的入口函数是在html所有标签全部加载之后就会去执行


二、选择器

基本选择器

符号

说明

用法

$(“#demo”)

选择id为demo的第一个元素

$(“#demo”).css(“background”,”red”)

$(“.liItem”)

选择所有类名（样式名）为liItem的元素

$(“.liItem”). css(“background”,”red”);

$(“div”)

选择所有标签名字为div的元素

$(“div”). css(“background”,”red”);

$(“*”)

选择所有元素

少用或配合其他选择器来使用

$(“*”). css(“background”,”red”)

$(“.liItem,div”)

选择多个指定的元素，这个地方是选择出了 .liItem元素和div元素

$(“.liItem,div”). css(“background”,”red”)

层级选择器

符号

说明

用法

 空格

后代选择器

选择所有的后代元素

$(“div span”). css(“background”,”red”);

> 

子代选择器

选择所有的子代元素

$(“div > span”). css(“background”,”red”)

+

紧邻选择器

选择紧挨着的下一个元素

$(“div + p”). css(“background”,”red”)

~

兄弟选择器

选择后面的所有的兄弟元素

$(“div ~ p”). css(“background”,”red”)

    

基本过滤选择器

符号

说明

用法

:eq(index)

index是从0开始的一个数字，选择序号为index的元素。选择第一个匹配的元素。

$(“li:eq(1)”). css(“background”,”red”)

:gt(index)

Index 是从0开始的一个数字，选择序号大于index的元素

$(“li:gt(2)”). css(“background”,”red”)

:lt(index)

Index是从0开始的一个数字，选择小于index  的元素

$(“li:lt(2)”). css(“background”,”red”)

:odd

选择所有序号为奇数行的元素

$(“li:odd”). css(“background”,”red”)

:even

选择所有序号为偶数的元素

$(“li:even”). css(“background”,”red”)

:first

选择匹配第一个元素

$(“li:first”). css(“background”,”red”)

:last

选择匹配的最后一个元素

$(“li:last”). css(“background”,”red”)

属性选择器

符号

说明

用法

$(“a[href]”)

选择所有包含href属性的元素

$(“a[href]”). css(“background”,”red”)

$(“a[href=’itcast’]”)

选择href属性值为itcast的所有a标签

$(“a[href=’itcast’]”). css(“background”,”red”)

$(“a[href!=’baidu’]”)

选择所有href属性不等baidu的所有元素，包括没有href的元素

$(“a[href!=’baidu’]”). css(“background”,”red”)

$(“a[href^=’web’]”)

选择所有以web开头的元素

$(“a[href^=’web’]”). css(“background”,”red”)

$(“a[href$=’cn’]”)

选择所有以cn结尾的元素

$(“a[href$=’cn’]”). css(“background”,”red”)

$(“a[href*=’i’]”)

选择所有包含i这个字符的元素，可以是中英文

$(“a[href*=’i’]”). css(“background”,”red”)

$(“a[href][title=’我’]”)

选择所有符合指定属性规则的元素，都符合才会被选中。

$(“a[href][title=’我’]”). css(“background”,”red”)


三、JQ对象与DOM对象互转

3.1 JQ对象转DOM对象

方式一：$("#btn")[0]

方式二：$("#btn").get(0)


3.2 DOM对象转换成jQuery对象

var btn = doucument.getElementById("btn");

btn->$(btn);???????


四、样式操作

4.1 例子

$("div").css("background","pink");

$("div").css({"background":"pink",

        "color":"white"});

$("div").addClass("color-red");

$("div").removeClass("color-red");

$("div").toggleClass("color-red");//切换样式


var fontsize = $("li").css("font-size");//得到样式