前端开始学java_[Java教程]开启前端学习之路

[Java教程]开启前端学习之路

0 2014-06-10 17:00:06

前言

第一次在博客园写博客,写写自己开启前端学习之路。应该是受邢师兄的影响吧,不得不说邢师兄人很好,学习也很认真,师兄的前端也是自学的,但是学的很好,大家可以看看我师兄的博客,http://www.cnblogs.com/allenxing/。之前只是听师兄介绍过前端,自己也就慢慢开始学习,师兄说坚持写博客很好,一直没有开始写,觉得自己水平不够,怕自己写不好。但想想,永远不开始写就永远都不会,踏出第一步之后,坚持就会有成果的。文章中如果有任何错误的地方,欢迎大家纠正!一起学习,一起进步!这里向大家介绍个jQuery学习交流群:239147101。群里牛人很多,人也很好,大家可以互相交流学习。

正文

在师兄的指导下,我先在w3c上开始学习html、CSS、JavaScript。可以说学习html是没有困难的,之前在做过一个android课程的时候解析过一个

Chrome下查看CSS样式

在Chrome浏览器下按F12.就会出现如下的控制台:

bc91bb04e6e9c61e24c974e4440db8f2.gif

在左上角的地方有个像放大镜的图标,可以点击那个图标,放到页面中任何你想查看的元素上,下面它会自动跳转到该元素对应的html代码,右边框框也会显示改元素的CSS样式。你可以在右边框框改它的样式,添加删除、修改都可以,页面会随着你修改的而改变,当然,这只是暂时的,当重新刷新页面时,它会回到开始的样式。可以通过这样来实践的学习CSS,边学边查文档。

学习完CSS之后,我就学习Javascript,之前的html、CSS它们都是对页面进行静态的编辑。JavaScript就开启了对页面的动态效果,当然html5、CSS3现在也能产生各种非常漂亮的动画效果。这个有待继续的学习。现在目前也在学期JavaScript和JQuery.JavaScript的学习最初是通过看智能社的《JavaScript视频教程》,Blue老师讲的不错,大家可以看看。看完之后对JavaScript可以来说有了个整体的了解和掌握,不过还是要看书会掌握的更牢的。这里我不介绍JavaScript具体的知识了,在接下来的博客中我会边学习边整理一个JavaScript系列博文。也在这希望大家关注我,一起学习进步!

设计自己的博客风格

接下来我讲讲怎么设计修改自己的博文风格,相信大家都看到博客园博客风格各异吧,开始自己折腾了个半天,也想设计设计自己的博客,结果半天没弄出个啥,经过师兄的提点之后才明白,再次说说师兄人好,呵呵。。。要设计自己的博客风格,在博客的管理——>设置中有页面定制CSS代码等,这里就可以写自己的样式了。按照上面介绍的查看原有的CSS方法,找到博客园原本写好的元素class或id是什么,然后重新对它写自己的CSS样式,就可以设计自己的博客风格了。如果想申请JS权限,可以发邮件给博客园,会开通你的JS权限,就可以写自己的JS代码了。可以看我的一个生活杂谈博文:下辈子,无论爱与不爱,都不会再见。里面就是我用来测试自己的博客风格的,大家可以看到里面的“引言”、“哎,好水”等就是我重新写了CSS代码。题目下面的类似索引的小标题等就是自己写的JS代码自动的生成的。这里贴出来代码来吧,其实写的很不好,和师兄写的相差太远了,但是还是先用着自己的吧,等后续JQuery学通了,再改改。后续也会继续设计自己的博客风格。欢迎大家关注!

bc91bb04e6e9c61e24c974e4440db8f2.gif

bc91bb04e6e9c61e24c974e4440db8f2.gif// JavaScript Document

View Code

代码大家有兴趣就看看吧,应该很容易理解。如有不理解的或者好的改进的,欢迎交流!这里说个小插曲吧,最开始的时候我不是用的JQuery的$(function(){});而是用的JavaScript最笨的方式window.οnlοad=function(){};但是这个效果特别的不好,不过也是正常的,每次刷新页面的时候要整个页面加载完之后这些小标题才会出来,就会有一闪的瞬间,改进之后就不会这样了。

$(document).ready()和window.onload的区别

百度查了下它们之间的区别,其实本质上没有什么区别,都是指页面载入完成后执行指定函数。但是二者还是有所不同的,使用window.οnlοad=function(){}是希望在页面被载入时执行function中的处理,但是这些JS代码只有在页面上的全部内容加载完成(包括头部的banner广告,所有图片)的时候才会执行。将window.onload放在最上边的原因就是当你第一次运行codes的时候,HTML document还没有加载完成。而$(document).ready()却不需要载入得这么“完全”。$(document).ready()是在DOM结构载入完后执行的,而 window.onload是得在所有文件都加载完后执行的,注意区别,一个是DOM加载完,一个是所有文件加载完。因此,ready肯定在onload 之前发生,页面加载大或者多的图片而使onload执行延后,使用jquery的ready可缓解此问题。JQuery的ready是指在页面的DOM模型加载完后执行指定的函数。之所以经常用$(document).ready()来取代 window.onload,就是因为它是在dom模型加载完成后就执行,而window.onload是在dom元素加载完全后才执行。

我们可以用下面的代码测试一下谁先执行:

bc91bb04e6e9c61e24c974e4440db8f2.gif

bc91bb04e6e9c61e24c974e4440db8f2.gifwindow .onload =function (){ alert ("welcome");}; $(document).ready(function (){ alert ("thanks for visiting!");});

View Code

你会发现是 $(document).ready()先执行。

小结

好了,第一次写这么长的博客,之前一直是在csdn上写博客,也经常只是记录自己遇到的问题,很少像这样一个字一个字的写这么多,写了挺久的,不过感觉挺好,虽然没有很多知识点,但是也算是一个总结吧!后续会继续坚持写博客的!文章如果有错的地方,欢迎大家指出纠正!路漫漫其修远兮,吾将上下而求索。。。

PS:最近有点忙,更是有点迷茫。。。

本文网址:http://www.shaoqun.com/a/93627.html

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:admin@shaoqun.com。

前端

0

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/346366.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

python 傅里叶_基于python的图像傅里叶处理

import numpy as npimport matplotlib.pyplot as pltx np.linspace(-10, 10, 1000)a np.cos(x)b a np.cos(3 * x)# d np.log(x)c b np.cos(7 * x)d c - np.cos(10 * x)plt.subplot(2, 2, 1)plt.plot(x, a, label‘$cos(x)$‘, color‘green‘, linewidth1)plt.title(&q…

xalan_如何以10倍速加速Apache Xalan的XPath处理器

xalan一段时间以来, Apache Xalan中存在一个令人尴尬的错误,该错误是XALANJ-2540 。 此错误的后果是Xalan每次XPath表达式求值将内部SPI配置文件加载数千次 ,可以很容易地进行如下测量: 这个: Element e (Element)do…

EMUI10安装java_linux ubuntu系统安装java jdk和配置环境,pycharm安装

最近想使用pycharm,可是要想搭建java 环境,搞了很久才搞定,网上很多资料都是没用的。记录下来以后有用。首先加下载jdk安装包。我下的是jdk-6u37-linux-x64.bin,我把jdk安装在usr/lib/jvm1.sudo cp jdk-6u37-linux-x64.bin /usr/lib/jvm #将安…

python gevent async_python的异步初体验(gevent、async、await)

网络爬虫,这种io高密集型的应用由于大部分的时间在等待响应方面,所以CPU的使用率一直不高,速度也不快,为了解决这些问题,我们使用异步的方式来进行爬虫程序。串行的时候,如果我们要爬一个网站,那…

JEP 181不兼容,嵌套类/ 2

JEP 181是基于嵌套的访问控制https://openjdk.java.net/jeps/181 。 它是在Java 11中引入的,它故意引入了与先前版本的不兼容性。 这是一个很好的例子,与Java的先前版本兼容并不是刻板的规则,而是保持语言的一致性和稳定发展。 在本文中&…

abap 导入队列末尾_在C#中将对象添加到队列的末尾-排队操作

要将对象添加到队列的末尾,代码如下-示例using System;using System.Collections.Generic;public class Demo {public static void Main(){Queue queue new Queue();queue.Enqueue("Electronics");queue.Enqueue("Accessories");queue.Enqueue…

vim循环下表复制_Vimrc Init.vim太长了?不存在的

精简配置刚开始接触vim,你会被它各种好看的外观以及实用的插件吸引,各种折腾,不知不觉你的vimrc或者init.vim变得特别长,我之前的init.vim有多长?596行?wtf?每次维护的时候不知道有多麻烦&#…

C语言与JAVA内存管理_C语言内存管理

本章将介绍C语言动态内存管理. C语言编程语言提供了多种功能的内存分配和管理。这些函数可以在头文件中找到。S.N.函数与说明1void *calloc(int num, int size);此函数分配num元素其中每一个字节大小为(size)的数组2void free(void *address);此函数释放由地址指定的存储器块的…

使用LocalDate,LocalTime和LocalDateTime

Java 8对日期和时间API进行了重大更改,这是在JSR 310:日期和时间API的 JDK中包括了Joda Time API 。 此JSR由Joda Time的创建者Stephen Colebourne领导。 有许多惊人的API可用于日期和时间。 在本文中,我将介绍最常用的: java.ti…

visual studio odbc数据源设计器_NEW!WinForm界面开发设计时正式支持.NET 5

点击“了解更多”获取DevExpress v20.2完整版下载早在今年7月,官方技术团队宣布对DevExpress控件进行功能增强,使其支持最新的.NET 5 Preview。 但是尽管技术团队一直在努力确保WinForms控件与.NET 5兼容但在Visual Studio中对设计器的支持却是另一回事。…

java 接口的观察者模式_java观察者模式

观察者模式又叫做发布-订阅(Publish/Subscribe)模式。观察者模式定义了一种一对多的依赖关系,让多个观察者对象同时监听某一个主题对象。这个主题对象在状态发生变化时,会通知所有观察者对象,使它们能够自己更新自己。Observer结构图.pngSubj…

java 构建者模式_Java方法中的参数太多,第3部分:构建器模式

java 构建者模式在我的前两篇文章中,我研究了如何通过自定义类型和参数对象减少构造函数或方法调用所需的参数数量。 在本文中,我将讨论如何使用构建器模式来减少构造器所需的参数数量,并讨论该模式如何甚至可以帮助采用过多参数的非构造器方…

webgis从基础到开发实践_ArcGIS API For Javascript 开发笔记(四)

二、应用篇1、应用部署部署也就意味着一个 DEMO 或者系统即将完工,也意味着系统即将上线,相对来说Javascript 应用的部署不是很复杂,但是这是有前提的,要对部署中的一些概念有所了解,比如部署中常常提到的虚拟目录&…

Spock 1.2 –轻松进行集成测试中的Spring Bean模拟

探索如何使用Spock 1.2将Spock的模拟和间谍自动注入到Spring上下文中。 Spock中的存根/模拟/间谍(及其生命周期)一直与Spock Specification类紧密结合。 只能在测试类中创建它们。 因此,使用共享的预定义模拟(在单元测试和集成测…

geteditor p 取消自动_2020百度网盘超级会员怎么取消自动续费?

首先我们打开百度网盘,开通超级会员以后,可以看到个人中心有一个管理自动续费的,点击打开。2然后可以看到自己开通的界面旁边显示的有一个取消按钮。3点击取消以后,会提示我们自动续费享受的有优惠,我们继续点击确认取…

java堆和客栈_java中堆和栈的区别分析

堆和栈是java数据结构里非常重要的概念,本文较为详细的分析了二者之间的区别。供大家参考。具体如下:Java的堆是一个运行时数据区,类的(对象从中分配空间。这些对象通过new、newarray、anewarray和multianewarr栈的优势是,存取速度比堆要快&a…

php odbc驱动,用于Windows的PHP 7.0 ODBC驱动程序

我将PHP 5.6.30(https://www.apachefriends.org/de/download.html)升级到PHP 7.0(https://bitnami.com/stack/wamp/installer)到目前为止,一切都运行良好,当我使用MySQL数据库时,它将我的页面的加载时间从1,2秒减少到约300毫秒.但是现在我正在尝试使用以下简单脚本连接到MSSQL数…

分布式机器学习_229页,CMU博士张昊毕业论文公布,探索机器学习并行化的奥秘...

CMU 机器人研究所张昊(Hao Zhang)博士论文新鲜出炉,主要围绕着机器学习并行化的自适应、可组合与自动化问题展开。机器之心报道,机器之心编辑部。随着近年来,机器学习领域的创新不断加速,SysML 的研究者已经…

利用Excel或LibreOffice的业务输入进行单元测试约束

业务专家向我们(开发人员)解释业务限制。 但是,如何确保我们正确理解它们呢? 或更糟糕的是,一旦约束条件正式化,我们如何测试他们之间是否同意? 好吧,有一种很棒的方法可以做到这一…

Java播放歌词同步源码,Android 实现歌词同步

歌词同步的原理其实很简单:歌词显示是一个线程, 音乐播放时一个线程,通过播放时间将歌词显示进度与播放进度同步起来。网络标准的歌词格式是LRC。 我们看下一个LRC文档,其格式就一目了然了。[ti:爱][ar:小虎…