company-html's trick

知识点

建立树形结构时，使用dl,dt,dd标签，而不是使用ul li标签，如此便不需要另外为第一个li设置title样式
若顶栏和侧边栏固定时，内容栏可使用iframe进行异步加载，若该内容栏中有诸如新建这种需要跳转别的页面的功能，则可使用div嵌套iframe来实现异步加载。(即有两个iframe)
- 具体做法：加载内容页时，嵌套的iframe的父层设为display:none;，且嵌套的iframe的src=""，当点击新建btn时，再向iframe的父层设为display:block;，并将嵌套的iframe的src=对应的html路径

呈现表格的时候，要将表头，和表身分开成两个div嵌套table，并把表身定高，这样做是为了当表身内容无限多的时候，可产生滚动条，这样子，表头便固定在表格的顶部，用户体验就会更加好

弹窗的时候，其主要的html是

<div class="overlay-window">
      <iframe></iframe>
      <div class="caption"></div>
      <div class="content">
          <iframe></iframe>
      </div>
</div>

第一个iframe的src值为空，其目的是为了遮住视频控件，因为视频控件的z-index是相当高的，而第二个则是加载另外一个页面

要灵活运用自定义属性，以达到Js的扩展性
段落元素无法包裹块级元素，这样会大大降低在chrome浏览器的可读性，span是可以包裹住span的。
要熟练使用w3c标准，多使用语义化标签
要注意主次之分，使用pd10这些bootstrap的class只是为了不影响其他类名，切不可滥用这些类名，这会导致调试不方便（每次都要修改的时候都要在html上进行修改
可使用overflow: auto，使其在内容超出范围时产生滚动条。
啊，我又忘记了要好好思考那个html,css布局了，!important，如果思考的不仔细的话，可能会影响到日后的Js的编码，绝对不能重复，回去之后一定要改回来！
自适应布局，主要特点是：不设定高度，当内容超出容器范围时，出现滚动条。解决方法：将其设为绝对定位布局，并且设定其位置，其父级亦设成绝对定位position: absolute;，并设定其具体位置（top,left之类的），以避免内部文本超出文本流(即将父级与子级在同一层)
每当刷新页面时，有时候，页面会突闪(抖动)纵向滚动条（出现后立即消失，且内容很少，不足以出现滚动条），先说说解决方法，直接在<body></body>上设置overflow: hidden;(只要不设高度，overflow:hidden;便不会将超出的内容隐藏掉),便可解决这问题。
让文字只在一行当中呈现，不断行，使用class="text-overflow"(bootstrap的class)，与此同时，该元素需要设置宽度，这样便能呈现出该文字便能在一行当中呈现，而超出的部分用...展示，为了使该元素做到自适应宽度，还有另外两种更优的方法：
1. 让该元素的display:block;，原因是在正常文本流当中，该元素的宽度是由其祖先元素撑开，(由于checkbox和其右边的文本不在同一水平线)，故将其父级元素设为position: relative;，并将checkbox设为position: absolute;，然后再通过top，left之类的元素调整它的位置
2. table的特点是左列固宽，右列自适应table剩余的宽度，故该思路为将其父级元素设为display: table;，该元素及其同级元素设为display: table-cell;，这样亦可完成需求。
不能让用户的信息量的多少影响你的排版，而预先固定一个最大高度，然后在那个元素上添加纵向滚动条。
两端对齐的时候，然后信息很多的话，如何做到不影响排版呢？

感想

2017/4/25

感觉最近想法不正确，以为直接将对方的代码copy下来，就可以提高开发效率，却没有去思考该代码是否优化，甚至乎，很多时候，在人家冗杂的代码当中纠结许久，浪费自己的时间。而正确的提高写页面效率的思路应当是：

每当看到一个页面，应当先自己思考一下该布局如何实现，然后再去参考别人的代码是否已经实现了你的想法，若有，则可直接复用，若没有，则需要自己编写！千万要注意，复制糟糕的代码还不如自己编写的代码的开发效率快！

而我自己呢，却只是一味地复制粘贴别人的代码，丝毫没有去思考！长此以往，你永远都不能建起属于自己的代码库，而你也只会变成一个不会独立思考的人！

2017/4/26

今天在地铁上思考了一下接下来的计划，首先在公司里，若没有什么任务的时候便可以刷leetcode，然后晚上便在宿舍进行当天的工作总结，随后开始看算法书籍，然后做算法题，可将做题的内容放在github上进行版本管理，这样可以看到你解题思路的历程。

然后，今天在公司里没什么任务，于是我便刷起了leetcode，每每做完一道题，且当其呈现为绿色的Accepted的时候，我便感觉有一种自豪感驱使我继续闯关答题，嗯，所以我更要执行我的计划，让自己成为一个更加强的人。

2017/5/3

最近总是将自己的整块时间碎片化，每当复习算法的时候，就想着要不要做做前端的项目啊，然后又开始谷歌搜索前端项目。然后搜到一些很不错的项目之后，就添加为标签，然后继续浏览其他页面，至于之前积聚的项目却都不予以理会。我忽然想起了先前在公众号看到的一篇文章：

在看书的事情上，很多人都会在微信上列出自己的一大堆书单，可是你又真正看了几本书呢？

是啊，我觉得我陷入了一种怪异的自我满足情绪，就是每当看到一些成功的案例，或是一些有助于前端知识积累的列表，我就会毫不犹豫地去收藏，去添加标签，心里还沾沾自喜地想着，啊，有了这些干货，我肯定会变得很厉害，然后便开始心有旁骛地去干这干那的，可是这样子的效率真不是一般地低，每每想到9月份就要秋招了，可也许那时的我跟现在的我在前端上的距离却也没有拉开多少，这不正是别人所说的：

三个月的经验重复了5到6年

哦，这是多么让人沮丧的事情啊，想想那时候，别人也许已经成为了前端架构师，而你还在做着什么，前端页面仔！哦，我不要做这样的人！所以说从现在开始，我要好好管理自己的时间：

工作日学一个章节的算法(1.1为一个章节)，与此同时要刷leetcode(linklist)，一定要学会调试 Linklist，每天在leetcode做2~3题，然后就总结：
- 解题思路
- 排序的思想
学习《你不知道的js–（中卷）》看一个小节
Node.js，了解基本概念，然后跟着做一些web应用，然后了解一些框架和插件，然后慢慢摸索吧。

今天在公司刷leetcode的题，发现自己其实对链表的原理并不熟练，于是便想着要调试一下从而明白其原理。但是当我写测试用例的时候，发现并没有现成的函数让我去观察它的结果，然后我便一筹莫展，当我用谷歌搜索发现，人家早已经建立了自己的代码工具库，对啊，这种思维，这种独立的精神正是我所缺乏的，没有相应的函数库的时候，便自己去编写。忽然想起别人所说的：

linux思维和window思维，用window的人大多希望有现成的代码，让自己直接套用，而用linux的人则不同，他们很有Geek精神，当没有现成的代码库的时候，他们便自己去编写个性化的代码库，乐于分享，开源，尊重他人的劳动成果。

嗯，看来我得学习linux，这是对我Geek精神的培养。

2017/5/11

最近发现自己很容易就跳进自己所挖的坑，比如说刚开始的时候，容易