第一个js应用,web版的笔记本应用

本文作者分享了自己初次尝试使用JavaScript构建一个简单的Web版笔记本应用的心得体会。重点介绍了界面设计,通过div和CSS布局,以及如何使用JavaScript操作DOM进行动态数据展示。还讨论了JavaScript写文件功能,提到了ActiveX对象的兼容性问题,并计划未来实现数据以JSON格式存储到服务器。文章最后推荐了一些学习JavaScript的资源。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

     首先声明我做的笔记本目前来说很简单,但是我还是想跟大家分享一下我做这个的一些收获和心得。

     首先是做界面,以前总是认为做界面就是用dreamweaver做,到了公司后才知道界面要手写,不能用这个因为会生成很多我们不需要的东西,当时我一听这个认为好难 啊还要写CSS,其实只要你知道了怎么做很简单,就是div的结合与嵌套。我在这里将我做界面的过程:先定义一个大的 div然后再CSS中定义大小范围,可以在css中用border: 2px solid #FF0000;做标记,看看自己定义的div的位置,然后再div中嵌套div,在写嵌套的div的CSS时要加上position:absolute;表示你的div的位置是绝对的(我就吃了这个亏,总调不对位置)。文本就用textarea加入你的输入和显示都是文本的话,如果你想要显示图片链接等等,你的显示就要用div来显示,在js中document.getElementById("XX").innerHTML=XXX来把显示的内容写上去,其实都是一些动数据的操作的东西,用document.getElementById就可以全部解决。

     界面的东西基本说那个就是这些,其他的在你把界面的大致框架写出来之后就自然会了,然后是js的东西,js的引入相信大家都知道,在.js文件中直接写函数,声明就可以,但是要记住写的时候一定要知道代码中的东西都是干什么的不能带着疑问去撞大运编程(主管跟我说过的。。。。),主要的代码是:

var WriteFile = function(){
    var fso = new ActiveXObject("Scripting.FileSystemObject");
    var txtname = "E:\\"+noname +".txt";         //js中支持字符串连接
    var f1 = fso.CreateTextFile(txtname,"true");
     // f1 = fso.OpenTextFile(txtname,8,true);
    f1.WriteLine(nocontent);
    f1.Close();
    alert('ok');
  }

    其实就是一个写文件函数里面的东西都是js自己本身的东西,另外ActiveX google不支持,IE支持,别的浏览器没试不知道,但是Active是个控件,应该是我没有装吧在google上,用了ActiveX感觉兼容性很差,我本想把数据存储到json中相当于QQ的本地存储,但是json是一种数据交换语言,还需要server的支持,下周的时候我会写一个简单的server把笔记存在json文件中。要存成json格式就得是对象,编程的时候要注意OO思想的应用别把代码挤到一块(我就被主管说了这个问题),还有就是学习js要注意动手动脑,比如js中的对象,你可以把公司想象成一个对象,公司的老板主管同事就是对象的属性,而老板同事会做不同的事情,你就可以添加方法来表示他们的事情,其实就是用js的对象来描述一个东西一件事情就把它当成小朋友写作文一样,多练才能提高编程能力。说了这么多感觉都是大白话没啥值得大家学习交流的东西,其实都是我的一些简单编程的心得。

     最后我想推荐几个我学js时感觉不错的网站博客给大家:www.w3school.com/cn(估计都知道,很不错的!),www.w3cfuns.com(前端网,前端的东西很多很酷!)学习闭包时可以去看阮一峰的博客,讲的深入浅出。这个知乎回答http://www.zhihu.com/question/19951193全看了就能找到很多学习的网站博客等,都是别人推荐的,你在里面绝对会学到很多知识。这周就这样吧,下周一定贴出一些有质量的代码来!!


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值