需求,现在要求两个按钮,点击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. HTML/CSS点滴记录

    1. overflow 定义溢出元素内容区的内容会如何处理 visible 默认值.内容不会被修剪,会呈现在元素框之外. hidden 内容会被修剪,并且其余内容是不可见的. scroll 内容会被修 ...

  2. C#递归加载目录树

    /// 获取目录管理信息集合 /// </summary> /// <returns></returns> public List<CatalogTree&g ...

  3. C#将数据写入本地文件

    在平时开发过程中,可能会碰到内网测试没问题,但是更新到外网时会报错,这时我们又无法在外网进行调试.如果我们分析完业务可能产生的问题还是无法得到报错的原因,那么可以在关键的地方加上异常处理,然后将异常或 ...

  4. vuejs基础-style样式

    在Vue中使用样式 使用class样式 数组 <h1 :class="['red', 'thin']">这是一个邪恶的H1</h1> 数组中使用三元表达式 ...

  5. GitBook "How to be a programmer"

    网址:https://www.gitbook.com/book/braydie/how-to-be-a-programmer/ 最近看了这本 GitBook,主要讲程序员应该掌握的技能和注意的问题,分 ...

  6. 《JAVA设计模式》之代理模式(Proxy)

    在阎宏博士的<JAVA与模式>一书中开头是这样描述代理(Proxy)模式的: 代理模式是对象的结构模式.代理模式给某一个对象提供一个代理对象,并由代理对象控制对原对象的引用. 代理模式的结 ...

  7. Windows组决策

    https://blog.csdn.net/wangjunjun2008/article/details/82426587

  8. html-mailto

    MailTo 属性 mailto 属性可以设置到a 标签和form 标签中 例如: <a href="mailto:****@qq.com">send mail< ...

  9. 理解Throughput和Latency

    Throughput,中文译作吞吐量.Latency,中文译作延迟.它们是衡量软件系统的最常见的两个指标. 吞吐量一般指相当一段时间内测量出来的系统单位时间处理的任务数或事务数(TPS).注意“相当一 ...

  10. Win10电脑查看已连接过WiFi密码的命令

    运行中输入CMD,回车,打开命令行窗口. 输入:netsh wlan show profiles    执行后,会列出搜友已连接过的WiFi名字: 输入:netsh wlan show profile ...