什么是对象 简单点说,编程语言中的对象是对现实中事物的简化。例如,我们一个人就是一个对象,但是编程语言很难完全描述一个这样复杂的对象。所以我们必须做出简化,首先,将人简化成属性和行为的组合,然后仅仅保留对程序有意义的几个属性以及行为。例如,我们做一个统计某学校的人的身高的程序,那么我们在这个程序中就可以把人的行为省略掉,只保留行为,并且只保留身高这一个属性。这样,我们就得到了一个最简单的对象。 Java...
比如要在一个列表中利用ajax插入一个li的时候,我会直接把数据跟html标签拼接成一句完整的html,然后插入到ul中。无论数据是从服务器端拿回的,或者是从用户的input输入中拿到的——无论哪种方法都是一样。 这个拼接过程放在JavaScript文件中,显得非常不优雅。如果还把style也放在JavaScript中,那数据、结构还有样式整个就是一锅粥了,要维护这样的代码会让人想自杀。最过分的就是把页面上最终要生成的HTML都直接放在服务器端,a...
Knockoutjs是一个JavaScript实现的MVVM框架。主要有如下几个功能: 1. Declarative bindings 2. Observables and dependency tracking 3. Templating 它对于分离前台的业务逻辑和视图简化数据绑定过程有显著的作用。闲言少叙,直接看例子,如何下载也不说了,如果用VS开发的话用Nuget就可以一键搞定。1.基本绑定和依赖跟踪 首先需要定义一个ViewModel: 代码如下: function ViewModel() { this.firstName = "Zixin"; this.lastName ...
《jQuery权威指南》第1章jQuery开发入门,本章通过循续渐进的方式,先从jQuery的基础概念入手,介绍jQuery库的下载,引入简单应用方法;后部分侧重于jQuery控制DOM对象和页面CSS样式的介绍,通过一些简单的小示例,使读者对jQuery在页面中的功能应用有一个大致的了解,为下一章节进一步学习jQuery库的详细对象和方法奠定基础。本节为大家介绍jQuery程序的代码风格。 1.1.5 jQuery程序的代码风格 1.“$”美元符的使用 在jQuery程序...
1、JavaScript访问DOM对象方法: var oTxtValue=document.getElementById("Text1").value; 2、JQuery访问DOM对象方法: var oTxtValue=$("#Text1").val(); 通过JQuery库中的方法访问或控制页面中的元素,比使用JavaScript代码要简洁得多,而且兼容各浏览器。 示例代码: 代码如下: 控制DOM对象 .divFrame{width:260px;border:solid 1px #666;font-size:10pt} .divTitle{background-color:#eee;padding:5px} .divContent...
1、JQuery选择器继承了CSS、path语音的部分语法,允许通过标签名、属性名、内容对DOM元素进行快速、准确的选择。 2、JQuery选择器与JavaScript相比,具有代码简单、完善的检测机制的优势。 3、使用JQuery选择器实现隔行变色,示例代码如下: 代码如下: 使用JQuery实现隔行变色 body{font-size:12px;text-align:center} #tbStu{width:260px;border:solid 1px #666;background-color:#eee} #tbStu tr{line-height:23px} #...
一、官方网站下载:http://jquery.com 二、引入JQuery文件库 下载完后不用安装,只需将文件导入页面中即可,即在中加入如下代码: 三、编写一个弹出对话框的简单应用。 代码如下: New Document $(document).ready(function(){ //$是JQurey程序的标志 alert("您好,欢迎来到JQuery世界!");}) 效果图如: 四、JQuery基本结构为: 代码如下: $(document).ready(function(){ //程序段 }) 类似于JavaScript代码:wi...
1、功能需求:表格中数据隔行变色、删除数据、全选删除、鼠标移动到图片时显示图片预览 2、示例代码如下: 代码如下: 数据管理 body{font-size:12px} table{width:360px;border-collapse:collapse} table tr th,td{border:solid 1px #666;text-align:center} table tr td img{border:solid 1px #ccc;padding:3px;width:42px;height:60px;cursor:hand} table tr td span{float:left;padding-left:12px} table tr th{ba...
1、编写一个导航条,单击标题时,可以伸缩导航条内容,简化内容或显示更多内容。 示例代码如下: 代码如下: New Document body{font-size:13px} #divFrame{border:solid 1px #666;width:301px;overflow:hidden} #divFrame .clsHead{background-color:#eee;padding:8px;height:18px;cursor:hand} #divFrame .clsHead h3{padding:0px;margin:0px;float:left} #divFrame .clsHead span{float:right;margin-top:3px} #div...
1、在JQuery Mobile中,多个页面的切换是通过元素、并将属性设置为#+对应的id号的方式进行的。 2、多页面切换示例代码: 代码如下: New Document <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> JQuery Mobile 这是首页 详细页 3I工作室版权所有 JQuery Mobile 这里是详细页 返回首页 3I工作室版权所有 3、效果图预览:点击详细页将切换到另一页:4、除了内链接外,还有外链接,实现方...
1、内部链接是通过在标签内将href属性值设为#+id的形式,外链则是在中增加rel属性,并将属性值设为external,如:3i Studio 2、外部链接切换示例代码: 代码如下: New Document <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> 天气预报 今天| 明天 @2013 3i studio 今天天气 4~7'C晴转多云微风 3i Studio提供 @2013 3i studio 外部文件about.html代码: 代码如下: New Doc...
1、需要运行JQuery Mobile 移动应用页面,需要下载JQuery Mobile 3个相关插件文件(有多版本),jquery.mobile-1.2.0.min.css、jquery-1.8.3.min.js、jquery.mobile-1.2.0.min.js,JQuery Mobile官网地址:http://jquerymobile.com 2、将插件文件加载到页面中,注意它们的加载顺序,语句如: 代码如下: <script src="Js/jquery-1.8.3.min.js" type"text/javascript"></ script> 3、Hello World的示例代码如下: 代码如下: ...
Three.js是一个伟大的开源WebGL库,WebGL允许JavaScript操作GPU,在浏览器端实现真正意义的3D。但是目前这项技术还处在发展阶段,资料极为匮乏,爱好者学习基本要通过Demo源码和Three.js本身的源码来学习。 0.简介 嗨,这是我的第一篇关于如何写出好的代码的文章。和很多开发者一样,我通过实践学习,但同时我也向其他更有经验的开发者们学习。在过去的几个月中,我在canvas标签上花了很多时间,我想如果把这段时间学到的关于WebGL...
译序 Three.js是一个伟大的开源WebGL库,WebGL允许JavaScript操作GPU,在浏览器端实现真正意义的3D。但是目前这项技术还处在发展阶段,资料极为匮乏,爱好者学习基本要通过Demo源码和Three.js本身的源码来学习。 0.简介 嗨,又见面了。这么说我们已经开始学习Three.js了,如果你还没有看过之前三篇教程,建议你先读完。如果你已经读完前面的教程了,你可能会想做一些关于粒子的东西。让我们直面这个话题吧,每个人都爱粒子效果。不...
译序 Three.js是一个伟大的开源WebGL库,WebGL允许JavaScript操作GPU,在浏览器端实现真正意义的3D。但是目前这项技术还处在发展阶段,资料极为匮乏,爱好者学习基本要通过Demo源码和Three.js本身的源码来学习。 .简介 这是WebGL着色器教程的后半部分,如果你没看过前一篇,阅读这一篇教程可能会使你感到困惑,建议你翻阅前面的教程。 上一篇结束的时候,我们在屏幕中央画了一个好看的粉红色的球体。现在我要开始创建一些更加有意思...