javascript以及衍生框架自学笔记

向右看齐 2022-08-03 13:54 155阅读 0赞

开发遇到的一些小记录，基础知识写的可能不全。

# javascript 入门 #

## 变态的函数声明 ##

### 方法1 ###

function functionName(parameters) { 
            doSomething;
        }

### 方法2 ###

var x = function (a, b) { return a * b};
        var z = x(4, 3);

### 方法3 ###

(function () { 
            var x = "Hello!!";      // 我将调用自己
        })();

### 方法4 ###

var myObject = {
            firstName:"John",
            lastName: "Doe",
            fullName: function () { 
                return this.firstName + " " + this.lastName;
            }
        }
        myObject.fullName();         // 返回 "John Doe"

## 使用心得 ##

### 构造函数 ###

// 构造函数:
        function myFunction(arg1, arg2) { 
            this.firstName = arg1;
            this.lastName  = arg2;
        }
    
        // This creates a new object
        var x = new myFunction("John","Doe");
        x.firstName;

### 操作cookie ###

*  调用jquery 的 $.cookie

使用方式如下：

首先引入jquery.cookie.js

在`javascript`中使用

//读取
        var value = $.cookie('key');
    
        //写入
        $.cookie('key', 'value', { expires: 7, path: '/' });

*  直接实现

### cookie 读取与保存 Object ###

*  带完善

### 搜索DOM ###

*  id
    
     *  $(“\#id”) **jquery的搜索方式**
     *  document.getElementById(“demo”) **该方法直接调用javascript，速度更快**
 *  待补充。。。。

### 循环 ###

*  jquery 比较方便

$.each(list, function(i, item){ 
            doSomething;
        })

### ajax ###

[W3School教程][W3School]

*  jquery 比较方便\[待补充\]

$.ajax(){
    
            type: "POST",
            url: "api/getdata",
            timeout : 2000,
            data: { param1 : value1, 
                    param2 : value2
                    },
            success: function(data){ 
    
                console.log(data);
            },
            error: function(){ 
                console.log("fail");
            }
        }

### 从cookie读取为Object ###

*  Object以json格式存在cookie中
 *  用`eval()`函数恢复成Object

//Json to Obj
        var ObjectJson = $.cookie('obj');
        var obj = eval(ObjectJson);
    
    
        //Obj to Json
        // [{"param1" : "value1" , "param2" : "value2"}]
        var json = "[{\"param1\":\"" + value1 + "\",\"param2\":\"" + value2 + "\"}]";

# jquery-mobile #

## api ##

http://api.jquerymobile.com/“>API

## 页面载入特性 ##

在jqeury-mobile框架中进行页面跳转时候出现第二页面的js脚本不执行的情况。

*  特性与解决

卸载jquery-mobile页面的中的js引用只会在打开第一个页面时候载入，之后的页面跳转仅载入内的内容，所以第二页面的实际没有起作用。

解决方式:

在第二页需要继续引入的包放在中。

# bootstrap #

## 可视化构建 ##

页面框架构建比jquery-mobile方便。有可视化构建工具，其一大优点即默认生成的就是带自适应的HTML页面。可以轻松实现跨设备浏览。