昨天总结:昨天满打满算也就学习了7小时,刚好及格,但是不足之处是昨天的学习总是断断续续,这极大地影响了学习效率,本应该昨天下午就要进行v系列的学习,所有,关于学习时间安排提出两点要求,每当学习2小时候要休息15分钟作为缓冲,然后再进行学习,连续学习超过3小时后面的效率极大的下降;其次,遇到问题记得先记录好,养成勤做笔记的习惯,每天上午或下午学习后做个简短的总结反馈自己的学习情况,学习时还是老规矩,边学边分析,理智处理。
获得的学习方法:拆分法:将一个大块拆成一小部分看;
今天的主要任务:
1、浏览每个html文件并记录其主要用途;
2、构建网站前端的关系图,理清思路,便于代码敲写;
3、按照关系图里的先后顺序,模仿小说站html文件敲代码,并且一边记录知识点和问题。
4、晚上整理一天问题,知识点,备份到博客;
今天上午的任务:
1、将昨天的疑难点整理好,包括姐夫回复邮件后,有些要重新编写,最后编写入疑难点笔记内;完成
2、将文件数据备份到简书内;完成
3、开始框架v的学习,早上先大致浏览对应之间的关系后,构建关系图,下午再开始代码敲打任务;
看过v里面内容后感觉对着打不现实,所以目前主要以修修改改为主;
因为小说站v里面前端代码特别多,所以我决定,先看v里面每个的代码,并将每个块的功能记录,直至浏览完成,我再进入localhost:8888里面浏览其具体的作用。
小说站:
novels.scala.html:小说网站的主页
novel_layout.scala.html;小说页面名称
novel_search.scala.html;作用搜索模块的内容;
novel_sitemap.scala.html;为寻找小说编写的爬虫;
chapters.scala.html:为小说里的小说简介以及章节浏览
chapter.scala.html:为小说里的章节网站
article.sclal.html:作用貌似是为获取的文章的标签;?
趣味图:
index.scala.html:为趣味图的主页
search.scala.html:为趣味图提供搜索引擎;
sitemap.scala.html:为趣味图编写的爬虫
layout.scala.html:为趣味图模块编写的页面名称
addtext.scala.html:为给图片加文字或者水印用途;
服务器:
pages404;顾名思义,服务器出现问题时回应
总结:目前进度v内html基本上扫过一遍,大概作用了解清楚(除了个别),小说部分后面又细看了一次,因此提炼出了主要疑难点:
小说站问题:
1、最难看懂的就是function()类问题,例如以下等等,有关function()的内容?
<script type="text/javascript">
(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));
var bdcs = document.createElement('script');
bdcs.type = 'text/javascript';bdcs.async = true;
bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=6633628912348873229' + '&plate_url=' + encodeURIComponent(window.location.href)
+ '&t=' + Math.ceil(new Date()/3600000);
var s = document.getElementsByTagName('script'[0];
s.parentNode.insertBefore(bdcs, s);})();
</script>
又如novel_layout.scala.html内
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "//hm.baidu.com/hm.js?2a5cb6fabab78df6e7a82c25e8bc0b79";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','//www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-39567179-8', 'auto');
ga('send', 'pageview');
</script>
根据这个方法源代码我打算,明天将function()内容作为学习点之一,否则这一个障碍迈步过去;理解方法的构造原理,调用方法就应该不难了。
2、代码问题
<div id="recent-books" style="display: none;">
<h3>我最近摸过的书</h3>
<hr/>
<ul class="bookshelf">
</ul>//在网页中这里会多出内容,特别神奇,好像浏览的记录被保存了,在发送请求访问时又会呈现
</div>
<div class="clearfix"></div>
</div>
上图即为实现页面中显示
3、代码如下
@for(c <- categories) { //c和<-号不明来源,不明意思
@if(category.equals(c)) {
<li><div>@c</div></li>
} else {
<li><div><a href="@routes.NovelController.list(c, 1)">@c</a></div></li>
}
}
还有许许多多@+for/if ( 条件语句 ){ }的使用,我猜测这和java中条件语句一样使用效果一样,唯一的区别就是前面加个@感觉像是引入的前提条件,还有许多使用如@routes."控制器的类".“控制器类的方法”,我想@routes就调用控制器的中类方法的现行,等等,所以@routes的用法大概能猜测。
4、最有意思的是以下代码制造的循环效果:
@for((novel, index) <- novels.zipWithIndex) {
<li>
<a href="@routes.NovelController.chapters(novel.getId())">
![@novel.getName()](http://2bgif.com/covers/@novel.getCoverUrl())
<div>
<h4>@if(!novel.getIsOver()){<span style="color: #39A6A9">[连载中] </span>}@novel.getName()</h4>
<p class="popularity">人气: @novel.getPopular()</p>
</div>
</a>
<a class="author" href="@routes.NovelController.search(novel.getAuthor())">@novel.getAuthor()</a>
</li>
}
这个语句作用好像是根据小说类型的选择,将小说全部遍历出来;
其他的基本上相同类型,了解了这几个经典的,其他的也应该不难;
这个也拿出明天学习要点之一
5、评论区功能很费解,但是决定先跳过,感觉之后可以单独拿出来看;
6、html中的<meta>的用法需要进一步学习(不够熟练)
链接:http://www.w3school.com.cn/tags/tag_meta.asp
7、novel_sitemap.scala.html应该是爬虫页面,其自变量是根据小说集合,和作者集合去爬内容的,可是在所有网站中却并没有发现@novel_sitemap,这个有点困惑?
8、虽然@大多数浏览的时候都是后面加自变量或者条件语句,但输出文本的语句也要用
<p id="content">
@Html(chapter.getText().trim().replace("\n", "<br/><br/>"))
</p>//chapter.scala.html里面文本输出全靠这一句。
9、<input placeholder="显示内容" />中placeholder用于如果框中没有输入语句怎默认显示“显示内容”;