web首张卡开发须知

1.css样式的引用

    将写好的样式引入到ruby编程开发工具中的index.haml下

    格式如下:

    %link(rel="stylesheet" type="text/css" href="css/bootstrapswitch-custom.css")

    %link(rel="stylesheet" type="text/css" href="css/font-awesome.css")

    %link(rel="stylesheet" type="text/css" href="css/index.css")

2.js函数的使用

$scope.this_function_name=function(){

        函数体

}

函数也可写成这样,效果一样

function this_function_name(){

       函数体

}

$scope用于js与haml界面交互

函数使用时需要注重提高其复用性(通过参数传递区分是哪部分调用的这个函数),函数也可以相互调用,例如:

$scope.this_function_name=function(){

         this_function_name(activity)                                    //此处通过函数调用将activity参数下面函数的name

}

function this_function_name(name){                                //此处name与下面的name通过参数传递提高function复用性

        for(var i=0,l=activities.length;i<l;i++) {

            if (activities[i].name == name) {

                return true;

            }

        }

        return false;

    }

3.一些常用ng总结ng-tap  ng-repeat ng-show ng-disabeld  

   ng-tap 页面跳转,也可用于控制按钮的相关属性设置  %button.btn-4(ng-tap='go_create()'按钮 
   ng-repeat 遍历创建对象元素  %li( ng-repeat ="activity in activities") 
   ng-show显隐控制,控制按钮在一种状态下隐藏另一种状态下显示。
   ng-disabled常用于输入框对应控制按钮的可点击与不可点击控制,数据类型为布尔型。

   

4.数据存储

localStorage.setItem('activities',JSON.stringify(activities));数据存储语句,将activities存入activities,对于网站等存储一般是存储数组型数据,之前要先定义数组

定义数组如下:

var activities=JSON.parse(localStorage.getItem('activities'));定义一个activities数组

你可能感兴趣的:(html,js,web前端,Ruby,haml)