localStorage使用、val()和text()取值的区别、通过js将html文档加入页面中、js(jquery)实时监听input输入框值的变化、路径传参、代码提交流程

一、localStorage使用   参考链接：https://www.cnblogs.com/st-leslie/p/5617130.html

1.localStorage写入数据，三种方法

var storage=window.localStorage;  #需要先定义一个storage对象
//方法一：写入a字段
storage["a"]=1;
//方法二：写入b字段
storage.b=1;
//方法三：写入c字段
storage.setItem("c",3);    #一般使用这个写入
console.log(typeof storage["a"]);
console.log(typeof storage["b"]);
console.log(typeof storage["c"]);

注意：localStorage使用的也是遵循同源策略，所以不同的网站不能共用相同的localStorage,localStorage只支持string类型的存储。

2.localStorage读取数据三种方法

//第一种方法读取
var a=storage.a;
console.log(a);
//第二种方法读取
var b=storage["b"];
console.log(b);
//第三种方法读取
var c=storage.getItem("c");   #一般使用这个读取
console.log(c);

3.localStorage修改数据

就是获取到数据然后重新赋值

storage.a=4;

4.localStorage删除数据

1.将localStorage的所有内容删除

storage.clear();

2.将localStorage的某个键值对删除

storage.removeItem("a");

5.localStorage的键获取

var storage=window.localStorage;
            storage.a=1;
            storage.setItem("c",3);
            for(var i=0;i<storage.length;i++){
                var key=storage.key(i);
                console.log(key);
            }

使用key()方法，向其中出入索引即可获取对应的键

二、val()和text()取值的区别

text()返回所有匹配元素(如p、div等)的组合文本内容。val()用于获取输入元素的值(例如输入、选择等)

$("#drop").val()     #获取文本内容
$("#drop").text("设置内容")    #设置文本内容
$("#drop").attr("title")   #获取属性title的值
$("#label_content").empty()  #定位到div,然后使用empty()清空div框

三、通过js将html文档加入到页面中(js append方法)

1、静态界面当中：
     <div id="test"></div>
2、在js当中写入
     $("#test").append(html文档内容)：
     html文档即你要写入的内容

代码示例：

#需要添加的html页面  " 前面需要加 \
var text = "<li role=\"presentation\" class=\"active\">" +
     "<a href=\"#home\" aria-controls=\"home\" role=\"tab\" data-toggle=\"tab\">" + "tokenize" + "</a>" + "</li>";
 $("#navbar").append(text);
 
#需要添加进html页面的数据，可以通过拼接的方式加入
 var results = '';
 for (var i in result_token) {
      results += result_token[i]
 }
var content = "<textarea class=\"form-control\" id=\"message-text\" style=\"height:350px\" class=\"tokenize\">" + results + "</textarea>";

$("#tab-content").append(content);

四、js(jquery)实时监听input输入框值的变化

使用jquery的input事件

$("#input1").on("input propertychange",function(){
       console.log($("#input1").val())
});

jquery事件绑定：on()/bind()/delegate()，在jq1.7版本之后是使用on()
事件绑定就是在被选元素上添加一个或多个事件
上面的就是在input1上绑定input和propertychange事件

一、分清以下几个概念：
onchange事件：此事件会在元素内容发生改变，且失去焦点的时候触发。浏览器支持度较好
onpropertychange事件:此事件会在元素内容发生改变时立即触发，即便是通过js改变的内容也会触发此事件。元素的任何属性改变都会触发该事件，不止是value。只有IE11以下浏览器支持此事件
oninput事件:此事件会在value属性值发生改变时触发，通过js改变value属性值不会触发此事件。只有IE8以上或者谷歌火狐等标准浏览器支持。

二、然后我们主要是结合 HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件来监听输入框值变化。
oninput 是 HTML5 的标准事件，对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用，在内容修改后立即被触发，
不像 onchange 事件需要失去焦点才触发。不过oninput 事件在 IE9 以下版本不支持，需要使用 IE 特有的 onpropertychange 事件替代。所以就有了以上的写法。

五、路径传参

项目中涉及到的几种路径传参

以下都是在视图函数获取数据：
1.通过路径传参：
视图函数接口路径 /search
页面跳转路径 /search?label=label_name   #get请求能获取路径?后面的值，在浏览器上显示路由127.0.0.1:5000/search?label=肺
value = request.values["label"]        #value="肺"
2.路径传参：视图函数上路径设置/label_detail/<string:label_name>   #浏览器显示路由：127.0.0.1:5000/label_detail/肺癌
def label_detail(label_name):   #label_name="肺癌"        #通过路径将参数传入视图函数中
       pass
3.通过ajax传递参数:json格式参数
        在视图函数中通过value = request.get_data()获取ajax传递过来的参数data
        value = json.loads(value)    #反序列化value

注意：在ajax中如果写了dataType:'json'，说明服务器返回给前端页面的数据是json格式
前端页面就需要返回json格式字符串，可以通过json.dumps()
ajax的success接收的返回数据可以直接使用

六、真实环境代码提交流程

1.尽量做完一个功能就提交一次
2.如果不是在dev分支最好先切换到dev分支再提交:git checkout dev
3.提交之前先git pull,将本地代码更新到最新版本
4.提交：git add .      git commit -m '提交信息'     git push 

将dev的代码合并到master提交代码流程
1.从dev切换到master:git checkout master
2.合并dev分支的代码:git merge dev 
3.git push

项目没有发生冲突的情况下git提交流程

1.dev分支代码提交完成(dev)     git add ./commit/push
2.切换到master分支(dev)   git checkout master
3.将远程master分支代码先pull下来(master)   git pull
4.将dev分支代码合并到master分支中(master)    git merge dev 
5.push到远程master分支(master)   git push

项目合并发生冲突情况下git操作流程

1.先确定代码已经提交到dev分支上(dev)   先pull/add . /commit /push    #git pull可能出现代码冲突
2.切换到master分支,拉取master最新的代码 (dev)   
    git checkout master   
    git pull
3.master分支中合并dev，然后push上去(master)
    git merge dev      #将本地的dev合并到本地的master       #可能出现代码冲突
    git push           #将合并的本地master推送到远程master

4.如果出现冲突提示conflict，继续下面的命令，如果没出现代码冲突，代表已经成功的将dev分支代码提交到master上
5.打开本地编辑器能看到冲突代码，商量进行修改，在master分支中将修改的提交(master)
    修改好之后可以去git上查看master和dev分支上面的代码是否修改（可能这个时候只是master修改了）,将修改好的代码重新提交
    git add .
    git commit -m "修改冲突"
    git push
6.如果在git上面发现解决冲突之后只是master分支代码修改了，将master修改好的最新代码合并到dev(master)
保证master和dev分支的代码一致
    git checkout dev
    git merge master   #在dev分支上合并master
    git push     #将合并的本地代码push到dev分支