本文共 3316 字，大约阅读时间需要 11 分钟。

v-if、v-else:

vue模型数据：userlist:[           {user:{name:"huang1", age:10}},          {user:{name:"huang2", age:20}},          {user:{name:"huang3", age:30}}          ]视图：
 	
    
     {
  {item}}
    
     
    
     {
  {item}}
    

v-for:

//item是循环对象的子元素， index是基0的下标
   
    	 //循环数组     
    
{
  {item}}--{
  {index}}
     //循环json对象   value是属性值， key是属性     
    
{
  {key}}:{
  {value}}
   

v-bind(简写 :属性):

表示该属性的值引用vue模型中的数据或者部分引用

//:src属性引用vue中的bean.id

v-text:

解决插值表达式闪烁的问题

v-model:

数据的双向绑定， 模型数据改变， 视图数据也改变； 视图数据改变， 模型数据也改变。

//输入的数据转换成数字类型//输入的数据去除首尾的空格

前端请求映射， 但不需要返回数据时：

location.href="alipay?oid="+oid+"&total="+total;

axios语法：

//get请求---获取	//url代表映射地址, 注意这是 get 请求， 后端要用 @GetMapping 注释接收， 以下如是	axios.get(url).then(function(response) {
       	//.....................                        });		//post请求---提交	//data 是要提交的数据	axios.post(url,data).then(function(response){
           //.....................                  });		//delete请求---删除	axios.delete(url).then(function (response) {
   		//.....................        									);		//put请求---更新	//data 是要更新的数据	axios.put(url, data).then(function(response){
           //.....................      });

页面引用：

//引用页面//路径是templates文件下的html路径//表示引用 top.html中 
   
    .............
   
 的模块
   
   
其中 th:replace 是包括标签和内容全部换成你引用的内容     th:include 是只替换标签中的内容

//被引用的页面
   
    .............
   

标签条件选择：

//获取 类名为 orderItemPromotePrice 且标签属性 pid =2  span 标签的文本值var price= $("span.orderItemPromotePrice[pid=2]").text();//有 orderStatus 属性的标签a[orderStatus]

鼠标事件：

//div 表示标签, deleteOrderItem 表示 class	$("div.deleteOrderItem").click(function(){
   		//...................   	});

键盘事件：

$(".orderItemNumberSetting").keyup(function(){
   	//.................................});

失去焦点：

获取（修改）文本text值（不是标签属性值 ）：

var name= $("#name").text();var name= $("#name").text("修改的内容");

获取标签（任意）属性值（并改变属性的值）：

//获取该标签属性为 oiid 的值var oiid = $(this).attr("oiid")//获取 id 为 email 标签属性为 oiid 的值var oiid = $("#email").attr("oiid")//获取 src 属性， 并赋值$("img.selectAllItem").attr("src","img/site/cartNotSelected.png");

获取标签value属性：

var num= $(".orderItemNumberSetting").val();

获取和插入数据(html)：

//当使用该方法返回一个值时，它会返回第一个匹配元素的内容。$("#name").html() //获取第一个id=name的内容//当使用该方法设置一个值时，它会覆盖所有匹配元素的内容。$("#name").html("需要赋予的值")

获取标签固有属性：

var str7 = $("#link1").prop("action");

隐藏标签：

$("tr.cartProductItemTR[oiid="+deleteOrderItemid+"]").hide()

遍历同类名（class）的标签：

//此种对dom元素操作的函数要放在//vue.$nextTick(function(){
   //	执行代码//  })//中$(".cartProductItemIfSelected").each(function(){
     	if("selectit"==$(this).attr("selectit")){
          //$(this)代表循环个体               }});//直接对vue数据遍历把vue.pageInfo.content.forEach(function(value, i){
   	if(value.name.length>6){
   		value.name = value.name.substring(0,6) + "...";		alert(value.name);	}});

改变 css 样式：

$("button.createOrderButton").css("background-color","#C40000");

删除标签属性：

$("button.createOrderButton").removeAttr("disabled");

字符串截取：

params = params.substring(1);

字符串中替换某些字符：

// "W3School" 替换字符串中的 "Microsoft"str.replace(/Microsoft/, "W3School")// "W3School" 替换字符串中全部的 "Microsoft"str.replace(/Microsoft/g, "W3School")

字符串转化成整数类型（比较大小）：

var number = parseInt(num);

判断该变量是否为数字：

//是数字 返回 false//不是数字 返回 trueif(isNaN(num)){
   	//..............}

转载地址：http://syern.baihongyu.com/