发表于: 2019-05-14 22:19:06

1 801


今天完成的事:js2的静态页面

遇到的问题:

1.在写任务2的跳转的时候学习了第一个知识点跳转

function change() {
window.location.href="你所要跳转的页面";
}

一个点击事件点击跳转

这个是在原来的页面中跳转

第二种方法

<script type="text/javascript">
  window.open('你所要跳转的页面');
  </script>

这个是在新页面打开

页面停留指定时间再跳转(如3秒)
<script type="text/javascript">
  function jumurl(){
  window.location.href = 'http://www.mahaixiang.cn/';
  }
  setTimeout(jumurl,3000);
  </script>

2.接下来就是css代码

我用的是盒子套盒子

顶部flex布局

justify-content:space-betwen

让后进入主体

main

也是flex布局盒子套盒子

中间的问题是我本来就给了俩个大的div给了个flex 当我想在给一个div时 因为是flex的关系

div会出现在右边

我的解决方法是又给了一层div

这个div不用flex布局

然后在这个div里在给俩个div一个高度80%

一个高度20%

然后就是input框

我只做了只能输入11位还只能是数字有Bug

先写的静态页面往下走

3.input type=range;

main .down .slide input[type="range"] {
  1.    -webkit-appearancenone;
  2.    height10px;
  3.    width50%;

此处划重点

-webkit-appearancenone;

取消它的默认样式

给它个高度给它个宽度50%

outline :none;

再给一个背景颜色

然后就是滑动块的样式

input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
 height: 25px;
 width: 25px;
 margin-top: -5px; /*使滑块超出轨道部分的偏移量相等*/
 background: url("../img/cang.jpg") no-repeat center;
 border: solid 0.125em rgba(205, 224, 230, 0.5); /*设置边框*/
 box-shadow: 0 .125em .125em #3b4547; /*添加底部阴影*/
 background-size: 100% 100%;
}

取消默认样式

然后是用的背景图片做的

4.和师兄讨论了逻辑运算符

1、JS中的||符号:

运算方法:

     只要“||”前面为false,不管“||”后面是true还是false,都返回“||”后面的值。

     只要“||”前面为true,不管“||”后面是true还是false,都返回“||”前面的值。

总结:真前假后

结合我任务1的

(a==b|| b==c || c==a;)

就是当a的值等于b的时候不管后面的条件直接跳过后面的重新运行函数

2、JS中的&&符号:

运算方法:

     只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;

     只要“&&”前面是true,无论“&&”后面是true还是false,结果都将返“&&”后面的值;

总结:假前真后

这个呢我用代码跑了一下

是会选中相同的俩个盒子

就是有一个是真的就继续往下走直接输出值

中午吃饭的时候和师兄讨论了数据类型

俩大类

原始类型和引用类型

原始类型包括:数字  布尔值 underfind 字符串 null

引用类型:object

然后数字又分为整数 和浮点数

布尔值只有俩个true 或者false

字符串

字符串有length属性。

字符串转换:转型函数String(),适用于任何数据类型(null,undefined 转换后为null和undefined);toString()方法(null,defined没有toString()方法)。

和师兄问了一下事件

知道了鼠标事件

点击事件

inclick 

ondlbclick

键盘事件

不理解

里面又有细分明天看

明天的事:绑定一个先尝试改变 数值


返回列表 返回列表
评论

    分享到