1.bootstrap.mini.css文件作用:引进使用bootstrap文件使用bootstrap框架。引进代码f方法:
<head>
<link href="//lf26-cdn-tos.bytecdntp.com/cdn/expire-1-M/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"/>
</head>
一般为<link rel="stylesheet" href="路径/bootstrap.mini.css">
2.<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"
botton按钮定义的就是小屏幕下那个3根横杠的东西。其样式class=“navbar-toggle collapsed”是必不可少的。
navbar-toggle样式是控制3根斑马线的。
collapsed是为了响应折叠插件的。
data-toggle=“collapse”表明这个button是一个折叠控件,其折叠的内容指向data-target="#navbar",即是id为navbar的内容。
aria-expanded=“false”表示初始控件是折叠的。
<div id="navbar" class="navbar-collapse collapse" aria-expanded="false">这其中的nvabar-collapse是导航栏的折叠样式,collapse这是表示初始时是折叠的,若没有collapse样式,那么缩放后导航栏元素将是展开的
3.本代码中href表示一个跳转链接。当然href还有很多种链接作用。
<li>
<a href="./ulist.php">用户列表</a>
</li>
4.查看更新系统再无说明shift可以以谷歌浏览器列进入开发者模式F12。或者查看网页源码直接右键查看即可
5.$(document).ready(function()。是jquery库中
$就是jquery的简写,$()就是一个选择器,document是html的所有元素,$(document)返回一个数组,而这个数组是一个对象,这个对象调用ready方法,function则是ready里面的参数,就是说等这个页面全部加载完之后就去执行写入的js。而且在$(document).ready(function(){ });里面写入的js特效是和下一个里面写入的特效是不冲突的,俩者之间是不影响的,因此可以通过$(function(){});在一个页面中加载多个js。
您也许已经注意到在我们的实例中的所有 jQuery 函数位于一个 document ready 函数中:
$(document).ready(function(){ // 开始写 jQuery 代码... });
jquery函数对html元素进行更改。操作
6.html() 方法设置或返回被选元素的内容(innerHTML)。
当该方法用于返回内容时,则返回第一个匹配元素的内容。
当该方法用于设置内容时,则重写所有匹配元素的内容。
7.jquery中#的作用: #id 选择器通过 HTML 元素的 id 属性选取指定的元素。
页面中元素的 id 应该是唯一的,所以您要在页面中选取唯一的元素需要通过 #id 选择器
$(document).ready(function(){
$("button").click(function(){
$("#test").hide();//隐藏id=test的元素;$('#title').html('后台管理首页');html输出根据title输出管理页面
});
});
8.在谷歌开发者模式ctirl+shift+c进入到选择元素模式。
9.CSS常用到的初始化代码:
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;vertical-align:baseline;font-family:"Microsoft YaHei",Lato,"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:400}
10.jquery自定义函数用function( ):
11ajax:AJAX 是与服务器交换数据的技术,它在不重载全部页面的情况下,实现了对部分网页的更新。一般的使用类型为:
$.ajax({
type : "GET",
url : "ajax.php?act=getcount"+(getnew?'&getnew=1':''),
dataType : 'json',
async: true,
success : function(data) {}
})
12遍历数据$.each{ }和function(k,v)的用法:
在json中常常碰到这样的代码:
jquery $.each(data, function (index, value) {
})
遍历处理data,可以是数组、DOM、json等,取决于直接给定或者ajax返回的类型
function (index, value)中index是当前元素的位置,value是值。
13.append() 方法在被选元素的结尾插入指定内容后面。push() 方法可向数组的末尾添加一个或多个元素,并返回新的长度。typeof 可以用来检测给定变量的数据类型,可能的返回值“undefine,boolinea”等,formatter( )函数表示常用于字符串的拼接。
14.Bootstrap table 是一款基于 Bootstrap 的 jQuery 表格插件,功能比较完备,能够实现数据异步获取,编辑,排序等一系列功能。常用方法为:
$("#listTable").bootstrapTable({
columns:[
{
field: '',
checkbox: true
},
{
field: 'trade_no',
title: '系统订单号<br/>商户订单号',
formatter: function(value, row, index) {
return '<a href="javascript:showOrder(\''+value+'\')" title="点击查看详情">'+value+'</a></b><br/>'+row.out_trade_no;
}
},/*columns列表配置项,常用方法如设置field值和title等,也会结合formatter*/
]
})/*forma