html5实训考点

jq选择器

元素选择器

jQuery 元素选择器基于元素名选取元素。

在页面中选取所有 <p> 元素:

$("p")

用户点击按钮后,所有 <p> 元素都隐藏:

实例

$(document).ready(function(){  $("button").click(function(){  $("p").hide(); }); });

#id 选择器

jQuery #id 选择器通过 HTML 元素的 id 属性选取指定的元素。

页面中元素的 id 应该是唯一的,所以您要在页面中选取唯一的元素需要通过 #id 选择器。

通过 id 选取元素语法如下:

$("#test")

当用户点击按钮后,有 id="test" 属性的元素将被隐藏:

实例

$(document).ready(function(){  $("button").click(function(){  $("#test").hide(); }); });

<body>

<h2>这是一个标题</h2>

<p>这是一个段落</p>

<p id="test">这是另外一个段落</p>

<button>点我</button>

</body>

.class 选择器

jQuery 类选择器可以通过指定的 class 查找元素。

语法如下:

$(".test")

实例

用户点击按钮后所有带有 class="test" 属性的元素都隐藏:

$(document).ready(function(){

  $("button").click(function(){

    $(".test").hide();

  });

});

</script>

</head>

<body>

<h2 class="test">这是一个标题</h2>

<p class="test">这是一个段落。</p>

2.获取数组长度的方法

var arr=[2,6,1,5,22,3,66,12,9];

arr.length;

操作数组的几种方法

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title></title>

</head>

<body>

</body>

</html>

<script type="text/javascript">

1.shift

//删除原数组的第一项,并返回删除元素的值,如果数组为空则返回undefined

var a=[1,2,3,4,5];

var b=a.shift();//a:[2,3,4,5] b:1

2.unshift

//将参数添加到原数组开头,并返回数组的长度

var a=[1,2,3,4,5];

var b=a.unshift(-2,-1);//a;[-2,-1,1,2,3,4,5] b:7//注:此方法在ie6.0下

//测试的返回值始终为undefined,在firefox下测试的返回值为7,所以此方法不可靠

//一般需要用返回值时可用splice代替

3.pop

//删除原数组的最后一项,并返回删除元素的值;如果数组为空则返回undefined

var a=[1,2,3,4,5]

var b=a.pop();//a:[1,2,3,4] b:5

4.push

//将参数添加到原数组末尾,并返回数组的长度

var a=[1,2,3,4,5];

var b=a.push(6,7);//a:[1,2,3,4,5,6,7] b:7

5.concat

//返回一个新数组,是将参数添加到原数组中构成的

var a=[1,2,3,4,5]

var b=a.concat(6,7)//a:[1,2,3,4,5] b:[1,2,3,4,5,6,7]

6.splice

//splice(start,deleteCount.val1,val2,...):从start开始删除deleteCount项

//并从该位置起插入val1,val2,...

var a=[1,2,3,4,5];

var b=a.splice(2,2,7,8,9)//a:[1,2,7,8,9,5] b:[3,4]

7.reverse

//将数组反序

var a=[1,2,3,4,5]

var b=a.reverse();//a:[5,4,3,2,1] b:[5,4,3,2,1]

8.sort(orderfunction)

//按指定的参数对数组进行排序

var a=[1,2,3,4,5]

var b=a.sort();//a:[1,2,3,4,5] b:[1,2,3,4,5]

9.slice(start,end)

//返回从原数组指定开始的下标到结束下标之间的项组成的新数组

//不改变原数组

var a=[1,2,3,4,5]

var b=a.slice(2,5);//a:[1,2,3,4,5] b:[3,4,5]

10.join(separator)

//将数组的元素组起一个字符串,以separator为分隔符,省略

//的话则用默认的逗号为分隔符

var a=[1,2,3,4,5]

var b=a.join("|");//a:[1,2,3,4,5] b:"1|2|3|4|5"

11.indexOf

//数组元素索引并返回元素索引,不存在返回-1,索引从0开始

var a = ['a','b','c','d','e'];

a.indexOf('a');//0

a.indexOf(a);//-1

a.indexOf('f');//-1

a.indexOf('e');//4

</script>

数组操作的方法

shift:删除第一位 并返回删除的元素

unshift:数组最前面添加数据

pop:删除最后一位 并返回删除的元素

splice:第一位起始值 第二位删除的数量 第三到N是添加到数组中

join:将数组转化为字符串

push:向数组末尾添加元素并返回新的数组长度

reverse:翻转数组

slice:(start,end)截取数组

indexOf:查找数组中数据是否存在并返回其索引值

concat:将数组连接到数组末尾

sort:数组排序

<!--升序-->

var arr = [4,3,6,5,7,2,1];

arr.sort();

console.log(arr);

//输出结果[1,2,3,4,5,6,7]

<!--降序-->

var arr = [4,3,6,5,7,2,1];

arr.sort();

arr.so

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值