需求,现在要求两个按钮,点击1,背景为红色,点击2,背景为黄色

*****html代码
——————————————————————————————————————————————————
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>changzhecolour</title>
<!--通过外链引入css表单,id标记此link属性-->
<link rel="stylesheet" type="text/css" href="css1.css" id="link"/>
</head>
<body>
<!--定义一块区域,放入两个按钮-->
<div id="div">
<input id="d1" type="button" value="换成红色"/>
<input id="d2" type="button" value="换成黄色"/>
</div>
<script>
<!--lk这个变量代表了外链的内容,通过id=link这个链接。d1变量则是代表了id="d1"这个标签的内容,就是换成红色这个button-->
var lk = document.getElementById("link");
var d1 = document.getElementById("d1");
var d2 = document.getElementById("d2");
// 换成红色这个button的onclick属性 ,也就是发生在d1上的onclick事件,让lk变量代表的link改变了路径,进而改变div背景
d1.onclick = function () {
lk.href= "css2.css" };
d2.onclick = function () {
lk.href= "css1.css" }; </script>
</body>
</html> ————————————————————————————
****css1.css 代码
————————————————————————————
#div {
width:800px;
height: 800px;
background: yellow;
}
#d1{
width: 80px;
height: 30px;
margin: 20px 50px 0px; }
#d2{
width: 80px;
height: 30px;
margin: 20px 50px 0px; }
——————————————————————————————————————————
¥¥¥¥¥ css2.css 代码
——————————————————————————————————————————
#div {
width:300px;
height: 300px;
background: red;
}
#d1{
width: 80px;
height: 30px;
margin: 20px 50px 0px; }
#d2{
width: 80px;
height: 30px;
margin: 20px 50px 0px; }
												

js俩习题的更多相关文章

  1. JS答辩习题

    php高中班javascript答辩题目 1 什么是javascript?  答:Javascript是一种专门设计用来增强网页交互性的脚本语言,它也是一种解释型语言. 2 Javascript与C语 ...

  2. Java进击C#——应用开发之Asp.net

    本章简言 上一章中笔者讲到关于Linq和EF的用法.并以hibernate来进行讲解.那么本章笔者来讲一下C#的Asp.Net.即是在B/S模式下开发.现在企业大部分的业务都是面向B/S模式的.所以对 ...

  3. ReactJS入门(一)—— 初步认识React

    React刚开始红的时候,由于对其不甚了解,觉得JSX的写法略非主流,故一直没打算将其应用在项目上,随着身边大神们的科普,才后知后觉是个好东西. 好在哪里呢?个人拙见,有俩点: 1. 虚拟DOM —— ...

  4. ajax模拟获取json

    现在工作中我用到获取数据的方式,基本都是ajax.前台获取后端的数据后,需要进行处理,然后把他们放进页面中的相应标签里.下面举一个简单的例子,来模拟数据的获取和摆放. 这里用ng框架获取数据然后处理, ...

  5. 应用开发之Asp.net

    本章简言 上一章中笔者讲到关于Linq和EF的用法.并以hibernate来进行讲解.那么本章笔者来讲一下C#的Asp.Net.即是在B/S模式下开发.现在企业大部分的业务都是面向B/S模式的.所以对 ...

  6. React学习之redux

    在阅读本文之前,希望大家对以下知识点能提前有所了解并且上好厕所(文章有点长): 状态提升的概念 react高阶组件(函数) es6基础 pure 组件(纯函数) Dumb 组件 React.js的co ...

  7. 微信小程序获取多个input和textarea的值(es6加微信小程序APi)

    wxml js 俩行即可解决,money1,money2,money3

  8. 记一次Jquery学习引发的学习思考

    学习廖雪峰Jquery的教程关于表单的操作时,被最后的习题给困住了,在一番思索后无奈地决定去看博客评论下的答案,却发现自己看不懂,遂以为是对Jquery的了解还不够深,于是便在网上疯狂搜索关于Jque ...

  9. 1组-Alpha冲刺-5/6

    一.基本情况 队名:震震带着六菜鸟 组长博客:https://www.cnblogs.com/Klein-Wang/p/15564206.html 小组人数:7人 二.冲刺概况汇报 王业震 过去两天完 ...

随机推荐

  1. 爬虫(五)—— 解析库(二)beautiful soup解析库

    目录 解析库--beautiful soup 一.BeautifulSoup简介 二.安装模块 三.Beautiful Soup的基本使用 四.Beautiful Soup查找元素 1.查找文本.属性 ...

  2. DS静态查找- 顺序-二分-索引

    静态查找 静态表是只执行查找操作,而不执行插入.删除等操作的表. 现在常说的有五大查找方法:顺序查找.分块查找.索引查找.树查找.哈希查找. 后两种之前写过了二叉查找树和哈希表,现在回顾前面三种,它们 ...

  3. Netty核心组件介绍及手写简易版Tomcat

    Netty是什么: 异步事件驱动框架,用于快速开发高i性能服务端和客户端 封装了JDK底层BIO和NIO模型,提供高度可用的API 自带编码解码器解决拆包粘包问题,用户只用关心业务逻辑 精心设计的Re ...

  4. 21、numpy—Matplotlib

    NumPy Matplotlib Matplotlib 是 Python 的绘图库. 它可与 NumPy 一起使用,提供了一种有效的 MatLab 开源替代方案. 它也可以和图形工具包一起使用,如 P ...

  5. python学习三十三天函数匿名函数lambda用法

    python函数匿名函数lambda用法,是在多行语句转换一行语句,有点像三元运算符,只可以表示一些简单运算的,lambda做一些复杂的运算不太可能.分别对比普通函数和匿名函数的区别 1,普通的函数用 ...

  6. 一个简单的winform程序调用webservices

    本文原创,如需转载,请标明源地址,谢谢合作!http://blog.csdn.net/sue_1989/article/details/6597078 本文的编写IDE为VSTS2008和.NET F ...

  7. typescript 深层次对象内层(N)转外层(N),支持多层级递归转换,多应用于多语言数据结构转换

    如下数据结构转换 var a = { b: { en: 1, zh: 2, }, c: { en: 3, zh: 4, }, } //===> var b = { en: { b: 1, c: ...

  8. Python之带有外部状态的生成器函数

    带有外部状态的生成器函数,也就是你的生成器暴露外部状态给用户解决: 定义一个类,然后把生成器函数放到 __iter__() 方法中过去 定义一个类,然后把生成器函数放到 __iter__() 方法中过 ...

  9. go语言从例子开始之Example39.使用函数自定义排序

    有时候我们想使用和集合的自然排序不同的方法对集合进行排序.例如,我们想按照字母的长度而不是首字母顺序对字符串排序.这里是一个 Go 自定义排序的例子. Example: package main im ...

  10. Git最全总结

    一个小时学会Git   目录 一.版本控制概要 工作区 暂存区 本地仓库 远程仓库 1.1.什么是版本控制 1.2.常用术语 1.3.常见的版本控制器 1.4.版本控制分类 1.4.1.本地版本控制 ...