<!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. 浅析贝叶斯神经网络(Based on Variational Bayesian)

    https://blog.csdn.net/qq_20195745/article/details/82453589 贝叶斯神经网络简介 对于一个神经网络来说,最为核心的是如何根据训练集的数据,得到各 ...

  2. 注解配置spring

    1.为什么使用注解配置Spring基于注解配置的方式也已经逐渐代替xml.这个是不可逆的潮流,所以我们必须要掌握使用注解的方式配置Spring 总结:(1)使用注解配置Spring,注解的作用就是用于 ...

  3. SSM-网站前台博客系统制作(1)---前台+Google的Kaptcha

    前提: 1天半时间简单自己手写了一下前端布局和后台验证码的基本工作,简要说明一下遇到的问题和收获吧. 这次基本就是前台设计(首页)+Kaptcha图片验证码(之前弄了一个reCaptcha验证码 但是 ...

  4. js中call()的用法

    A.call(B,x,y) 1`改变函数A的this指向,使之指向B; 2` 把A函数放到B中运行,x和y是A函数的参数. //父类 Person     function Person() {   ...

  5. js函数式编程curry与compose实现

    //自行实现以下curry函数和compose //curry function curry(fn) { return function aa (...arg) { if (arg.length &g ...

  6. [Java]如何制作一个WordCount-Plus的Plugin

    主类 每个Plugin都有一个主类实现了com.jihuayu.wordcount.api.Plugin接口,这个主类就是插件的路口. 获取命令介绍 可以通过向方法getCommandUsage的参数 ...

  7. vue-cli 使用 webpack-bundle-analyzer

    # build for production and view the bundle analyzer report npm run build --report ​

  8. lambda 委托 匿名方法

    委托: delegate是C#中的一种类型,它实际上是一个能够持有对某个方法的引用的类.与其它的类不同,delegate类能够拥有一个签名(signature),并且它只能持有与它的签名相匹配的方法的 ...

  9. 'telnet' 不是内部或外部命令,也不是可运行的程序

    1.打开控制面板 2. 3. 4.这样就好可,重新打开cmd命令.

  10. redis缓存中间件基础

    前序: 默认使用SimpleCacheConfiguration 组件ConcurrentMapCacheManager==ConcurrentMapCache将数据保存在ConcurrentMap& ...