<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>开关按钮设置</title>
</head>
<link rel="stylesheet" href="css/Default style sheet.css" />
<style>
div{
width:120px;
margin: 0px auto;
border: 2px solid black;}
ul{ display: none;
}
</style>
<script>
window.onload=function(){
var odiv=document.getElementById("v");
var oli=odiv.getElementsByTagName("ul")[0];
var onf=true
odiv.onclick=function(){
if (onf==true) {
oli.style.display='block';
onf=false
} else{
oli.style.display='none';
onf=true
}
} }
</script>
<body>
<div id="v">
<h4>你好啊,小老弟</h2>
<ul>
<li>come</li>
<li>on</li>
<li>do</li>
</ul>
</div> </body>
</html>


js实现原生选项卡的更多相关文章

  1. js原生选项卡(包含无缝滚动轮播图)一

    原生js选项卡的几种写法,整片文章我会由简及难的描述几种常用的原生选项卡的写法: Improve little by little every day! 1>基本选项卡: 思路:循环中先清除再添 ...

  2. 原生js实现tab选项卡里内嵌图片滚动特效代码

    <!DOCTYPE HTML><html lang="en-US"><head><meta charset="UTF-8&quo ...

  3. 原生js面向对象编程-选项卡(自动轮播)

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. 大前端技术系列:TWA技术+TensorFlow.js => 集成原生和AI功能的app

    大前端技术系列:TWA技术+TensorFlow.js => 集成原生和AI功能的app ( 本文内容为melodyWxy原作,git地址:https://github.com/melodyWx ...

  5. 再谈React.js实现原生js拖拽效果

    前几天写的那个拖拽,自己留下的疑问...这次在热心博友的提示下又修正了一些小小的bug,也加了拖拽的边缘检测部分...就再聊聊拖拽吧 一.不要直接操作dom元素 react中使用了虚拟dom的概念,目 ...

  6. iOS开发--JS调用原生OC篇

    JS调用原生OC篇 方式一(反正我不用) 第一种方式是用JS发起一个假的URL请求,然后利用UIWebView的代理方法拦截这次请求,然后再做相应的处理. 我写了一个简单的HTML网页和一个btn点击 ...

  7. 去它的h5,我还是用js写原生跨平台app吧

    智能手机功能越来越强大,已经在逐渐替代电脑的作用.百度.腾讯.阿里的移动端日活数也在逐步的赶上甚至超越电脑端用户.叫喊着“mobile first”的公司越来越多,App开发者应运而生,且队伍日趋庞大 ...

  8. iOS下JS与原生OC互相调用(总结)

    这是去年总结的一篇文章,也一并先放到这个目录下好了. iOS开发免不了要与UIWebView打交道,然后就要涉及到JS与原生OC交互,今天总结一下JS与原生OC交互的两种方式. JS调用原生OC篇 方 ...

  9. JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性)

    JS(原生js和jq方式)获取元素属性(自定义属性),删除属性(自定义属性) 以下内容: 一.获取元素的属性 二.设置元素的属性 三.删除元素的属性 一.获取元素的属性 1-原生JS 获取属性 .ge ...

随机推荐

  1. MySQL_Key值(MUL、PRI、NUL)

    查询表结构: mysql> describe cc; +----------+-----------+------+-----+---------+-------+ | Field | Type ...

  2. inputClient.js

    $(document).ready(function () { loadData();}); //初始化数据function loadData(){ loadMList();//加载数据 $(&quo ...

  3. 写SQL语句常见的问题

    1.从一个表1查询的数据作为另一个表2的部分记录插入表2中 如果是固定值,直接再列5后面列出即可INSERT INTO 表1 (列1, 列2,列3, 列4, 列5,列6) SELECT 列1, 列2, ...

  4. showDialog 必须Stateful

    showDialog 必须Stateful 因为需要context

  5. 根据文字动态计算Label高度或宽度

    //根据已知的label宽度计算文字高度 CGRect rect = [reson boundingRectWithSize:CGSizeMake(label_W, 0) options:NSStri ...

  6. Linux命令-cut篇

    Cut 命令是常用的 Linux 命令,在这里总结一下平时常用的参数和用法,方便查证. 常用参数: -b:以字节为单位进行分割: -c:以字符为单位进行分割: -d:自定义分割符进行分割,默认为制表符 ...

  7. 物理层PHY 和 网络层MAC

    PHY模块简介 物理层位于OSI最底层,物理层协议定义电气信号.线的状态.时钟要求.数据编码和数据传输用的连接器. 物理层的器件称为PHY. 上图里的灰色方框图里的就是PHY芯片内部模块图. MAC器 ...

  8. 读《流畅的python》第一天

    1.跟运算符无关的特殊方法了解: 2.跟运算符相关的特殊方法了解: 3.内置的序列类型分类: 容器序列 list.tuple 和 collections.deque 这些序列能存放不同类型的数据. 扁 ...

  9. java中Map集合的常用方法 (转)

    原文地址:https://www.cnblogs.com/xiaostudy/p/9510763.html Map集合和Collection集合的区别 Map集合是有Key和Value的,Collec ...

  10. 配置IPMI

    服务器电源管理 查看服务器电源状态 ipmitool chassis power status 关闭服务器电源 ipmitool chassis power off 打开服务器电源 ipmitool ...