用自定义getElementByClassName函数做“查看更多”的特效
<!DOCTYPE html>
<html>
<head>
<title>查看更多</title>
<meta charset="utf-8">
<style type="text/css">
button {
display:block;
} a {
margin-top:60px;
text-decoration:none;
color:#2D5A87;
display:block;
} div {
margin:auto;
width:200px;
} p {
font-size:13px;
} .none {
display:none;
}
</style>
</head>
<body>
<div>
<p></p>
<p></p>
<p></p>
<p></p>
<p></p>
<p class="none"></p>
<p class="none"></p>
<button id="watchmore">查看更多</button>
<a href="../js project.html">返回主界面</a>
</div> <script type="text/javascript"> function getElementsByClassName (className) {
var all = document.getElementsByTagName('*');
var elements = new Array();
for (var e = ; e < all.length; e++) {
if (all[e].className == className) {
elements[elements.length] = all[e];
break;
}
}
return elements;
} window.onload = function(){
var watch = document.getElementById('watchmore');
var op =document.getElementsByClassName('none');
watch.onclick = function(){
if(watch.innerHTML == "查看更多"){
for(var i=; i<op.length; i++){
op[i].style.display = "block";
watch.innerHTML = "隐藏";
}
}
else {
for(var i=; i<op.length; i++){
op[i].style.display = "none";
watch.innerHTML = "查看更多";
}
}
}
} </script>
</body>
</html>
用自定义getElementByClassName函数做“查看更多”的特效的更多相关文章
- Date( )方法 章节中，你可以查看更多关于日期转换为字符串的函数
在 Date 方法 章节中,你可以查看更多关于日期转换为字符串的函数: 方法 描述 getDate() 从 Date 对象返回一个月中的某一天 (1 ~ 31). getDay() 从 Date 对象 ...
- 前端自定义format函数，做字符串格式化功能
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Oracle自定义聚集函数
今天工作中看见别人写的自定义聚集函数,所以一门心思的想搞懂,就在网上找资料了. 自定义聚集函数 自定义聚集函数接口简介 Oracle提供了很多预定义好的聚集函数,比如Max(), Sum(), AVG ...
- Python：Base4（map，reduce，filter，自定义排序函数（sorted），返回函数，闭包，匿名函数（lambda） ）
1.python把函数作为参数: 在2.1小节中,我们讲了高阶函数的概念,并编写了一个简单的高阶函数: def add(x, y, f): return f(x) + f(y) 如果传入abs作为参数 ...
- @JsonCreator自定义反序列化函数-JSON框架Jackson精解第5篇
Jackson是Spring Boot(SpringBoot)默认的JSON数据处理框架,但是其并不依赖于任何的Spring 库.有的小伙伴以为Jackson只能在Spring框架内使用,其实不是的, ...
- Matlab中如何将（自定义）函数作为参数传递给另一个函数
假如我们编写了一个积分通用程序,想使它更具有通用性,那么可以把被积函数也作为一个参数.在c/c++中,可以使用函数指针来实现上边的功能,在matlab中如何实现呢?使用函数句柄--这时类似于函数指针的 ...
- ashx ajax 与 自定义javascript函数
1.getUserPower为自定义javascript函数 获取权限 (1).ashx 处理程序的相对地址(必须是相对地址) (2).au 权限名称 (3).classname 类名 (4) ...
- 权限管理之基于ACL的实现：自定义JSTL函数实现即时认证
实现即时认证(即只有拥有相应的权限,才能做相应的操作) 经常用在,在JSP页面上,调用JSTL自定义函数做判断,显示相应的菜单或者功能按钮,比如只有管理员登陆时才显示“删除”按钮,从而完成权限的即时认 ...
- PHPCMS快速建站系列之自定义分页函数
内容分页的实现方法:{pc:content action="lists" catid="$catid" order="id DESC" nu ...
随机推荐
- 【leetcode❤python】 6. ZigZag Conversion
#-*- coding: UTF-8 -*- #ZigZag Conversion :之字型class Solution(object): def convert(self, s, numRow ...
- 微信小程序-画布组件
canvas 画布. 注: canvas 标签默认宽度300px.高度225px 同一页面中的 canvas-id 不可重复,如果使用一个已经出现过的 canvas-id,该 canvas 标签对应的 ...
- Maven打包程序
1.src/main目录下建立scritps.config.assembly目录 scritps:存放脚本文件如批处理 assembly:打包配置文件 2.assembly目录下建立package ...
- Less2css error 终极解决方案（转载）
用到less时遇到的问题 ,然后复制过来的 使用sublime Text3 的时候,安装less2Css后,和很多人一样以为大功告成,开始要运行编译less文件,结果开始发现 于是乎开始搜索问题和解决 ...
- Jmeter学习（一）
最近测了一个导出功能,感觉应该学习下Jmeter,WEB系统的性能系统还是需要有一定累积. 选择Jmeter而不是LR,很简单的原因是QTP和LR不能装一台机器上. 也有很多测试人员推荐Jmeter, ...
- thinkphp发邮件失败原因
使用phpmailer出现连接失败, 代码是别人已经封装好的没有问题,可能原因有如下. qq提示: SMTP server error: mail from address must be same ...
- dos命名重启或关闭远程服务器
1.建议远程连接.(把远程机器IP换成实际IP地址,把密码改为administrator的真实密码) net use \\远程机器IP\ipc$ "密码"/user:adminis ...
- Elasticsearch 检索
说到查询,那么索引也是一个绕不开的话题,可以说,没有索引就没有检索,先来看一个示意图 左边是索引过程,右边是检索过程.关键的步骤是分词过程,我用等号表示这两个过程一样,而且,必须一样,这个等号并不是模 ...
- php 二维数组排序
usort($info ,function($a,$b){ $a1 = $a['score']; $b1 = $b['score']; if($a1 == $b1) return 0; return ...
- vue.common.js?e881:433 TypeError: Cannot read property 'nodeName' of undefined
我觉得吧,是这么个原因,就是响应式要找这个node改它的内容,没找着,就报错了. 用computed监控vuex的state属性,绑定到页面上,如果这个属性改了,因为响应式,那么就要更改页面,如果页面 ...