一、数据类型判断与种类
例子:
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");//得到样式
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。