处理url请求参数
- url请求附加的参数以
?开头 以键值对方式存储=连接键值&连接多个键值对- 如
index.html?mid=150198&year=5 window.location.search返回url的附加参数 上面请求得到?mid=150198&year=5
- 如
注意url是一串字符串，所以传入键参数时要打引号
function getQueryString(name) {let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");let r = window.location.search.substr(1).match(reg);if (r != null) {return decodeURIComponent(r[2]);};return null;}let a=getQueryString("参数名");
获取图片真实宽高
获取图片真实宽高，不受样式影响
<img id="photo-player" .../>var screenImage = $("#photo-player");var theImage = new Image();theImage.src = screenImage.attr("src");var imageWidth = theImage.width;var imageHeight = theImage.height;
复选框全选，反选，全不选…
```javascript //默认复选框都是不选状态 //注意html复选框有一个checked的属性，该属性只要存在，无论是什么值都表示选择状态!
//表示默认状态，var定义就只会生效一次，后面点击无反应
let status = false;
//全选兼全不选按钮
$(‘#all-select’).click(function () {
//点击按钮，表示切换状态
status = !status;
//将复选框改为要切换的状态，使用attr方法只会生效一次。:checked是jquery特有的选择器，表示全部checkbox
$(‘:checkbox’).prop(“checked”, status);
});
//反选则是逐个切换为相反的状态 $(“#invert-select”).click(function () { $(“ :checkbox”).each(function (i, e) { $(e).prop(“checked”, !$(e).prop(“checked”));
})})
<a name="deFLY"></a>
# 选中输入框内的文本
- 点击输入框就选中输入框的文本
- onfocus是特殊焦点事件，主要作用于 <input>, <select>, 和<a>.。**其实是点击事件**
- **select() 将文本变为选中状态**
```javascript
<input name="textfield" type="text" id="textfield"value="Dreamweaver"onfocus="this.select()" />
- 选中输入框部分文本
setInput...只能对js对象操作，所以var input不能使用$("#x1")获取，能力不足不会改…- 0，2即选中输入框中字符串索引为0-2的2个字符 ```javascript
function setInputSelection(input, startPos, endPos) { input.focus(); if (typeof input.selectionStart != “undefined”) { input.selectionStart = startPos; input.selectionEnd = endPos; } else if (document.selection && document.selection.createRange) { // IE branch input.select(); var range = document.selection.createRange(); range.collapse(true); range.moveEnd(“character”, endPos); range.moveStart(“character”, startPos); range.select(); } } var input = document.getElementById(“x1”); $(“#hour-select”).hover( function() { setInputSelection(input, 0, 2); return false; });
<a name="hCIlH"></a>
# 表格导出excel
```html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" />
<style>
/* 此样式仅用于浏览器页面效果，Excel不会分离表格边框，不需要此样式 */
table {
border-collapse: collapse;
}
</style>
</head>
<body>
<!-- 设置border="1"以显示表格框线 -->
<table border="1">
<!-- caption元素可以生成表标题，其单元格列跨度为表格的列数 -->
<caption>学生成绩表</caption>
<tr>
<!-- 可以使用rowspan和colspan来合并单元格 -->
<th rowspan="2">编号</th>
<th rowspan="2">学号</th>
<th rowspan="2">姓名</th>
<th rowspan="2">性别</th>
<th rowspan="2">年龄</th>
<th colspan="3">成绩</th>
</tr>
<tr>
<th>语文</th>
<th>数学</th>
<th>英语</th>
</tr>
<tr>
<td>1</td>
<td>2016001</td>
<td>张三</td>
<td>男</td>
<td>13</td>
<td>85</td>
<td>94</td>
<td>77</td>
</tr>
<tr>
<td>2</td>
<td>2016002</td>
<td>李四</td>
<td>女</td>
<td>12</td>
<td>96</td>
<td>84</td>
<td>89</td>
</tr>
</table>
<a>导出表格</a>
<script>
// 使用outerHTML属性获取整个table元素的HTML代码（包括<table>标签），然后包装成一个完整的HTML文档，设置charset为urf-8以防止中文乱码
var html = "<html><head><meta charset='utf-8' /></head><body>" + document.getElementsByTagName("table")[0].outerHTML + "</body></html>";
// 实例化一个Blob对象，其构造函数的第一个参数是包含文件内容的数组，第二个参数是包含文件类型属性的对象
var blob = new Blob([html], { type: "application/vnd.ms-excel" });
var a = document.getElementsByTagName("a")[0];
// 利用URL.createObjectURL()方法为a元素生成blob URL
a.href = URL.createObjectURL(blob);
// 设置文件名
a.download = "学生成绩表.xls";
</script>
</body>
</html>
<style>
.tableA {
border-collapse: collapse;
}
.tableA .title th{
height: 50px;
font-size: 24px;
font-family: '微软雅黑';
font-weight: 700;
}
.tableA tr th {
border: 1px #000 solid;
height: 40px;
background: #efefef;
}
.tableA tr td {
padding: 0 40px;
border: 1px #000 solid;
height: 40px;
text-align: center;
}
.tableA .footer td {
font-size: 20px;
font-weight: 700;
}
</style>
<div id="table_wrapper">
<table bordercolor="black" class="tableA">
<tr class="title">
<th colspan="4">学生信息</th>
</tr>
<tr>
<th>名字</th>
<th>性别</th>
<th>年龄</th>
<th>班级</th>
</tr>
<tr>
<td>张三</td>
<td>男</td>
<td>19</td>
<td>1班</td>
</tr>
<tr>
<td>李四</td>
<td>男</td>
<td>20</td>
<td>2班</td>
</tr>
<tr>
<td>王五</td>
<td>男</td>
<td>21</td>
<td>3班</td>
</tr>
<tr class="footer">
<td colspan="4">总人数：3人</td>
</tr>
</table>
</div>
<script>
window.onload = function() {
var oTable = document.getElementById("table_wrapper").innerHTML;
var excelHtml = `
<html>
<head>
<meta charset='utf-8' />
<style>
.tableA {
border-collapse: collapse;
}
.tableA .title th{
height: 50px;
font-size: 24px;
font-family: '微软雅黑';
font-weight: 700;
}
.tableA tr th {
border: 1px #000 solid;
height: 40px;
background: #efefef;
}
.tableA tr td {
padding: 0 40px;
border: 1px #000 solid;
height: 40px;
text-align: center;
}
.tableA .footer td {
font-size: 20px;
font-weight: 700;
}
</style>
</head>
<body>
${oTable}
</body>
</html>
`;
// 创建 Blob 对象
var excelBlob = new Blob([excelHtml], { type: "application/vnd.ms-excel" });
var oA = document.getElementById("down-file");
// 会产生一个类似blob:d3958f5c-0777-0845-9dcf-2cb28783acaf 这样的 URL 字符串
// 这里 URL.createObjectURL(excelBlob) 会创建一个URL 的 Blob 对象
oA.href = URL.createObjectURL(excelBlob);
oA.download = "test.xls";
oA.click = function() {
this.click();
};
};</script>
<a id="down-file" href="#">点击下载文件</a>
实时统计输入字数
<div>
<textarea id="txt" maxlength="10"></textarea>
<p><span id="txtNum">0</span>/10</p>
</div>
var txt = document.getElementById("textarea");
var txtNum = document.getElementById("fontsize");
var sw = false; //定义关闭的开关
txt.addEventListener("keyup", function(){
if(sw == false){
countTxt();
}
});
txt.addEventListener("compositionstart", function(){
sw = true;
});
txt.addEventListener("compositionend", function(){
sw = false;
countTxt();
});
function countTxt(){ //计数函数
if(sw == false){ //只有开关关闭时，才赋值
txtNum.textContent = txt.value.length+"/120";
}
}
var nowDate=new Date();
var time=new Date().setMonth((new Date().getMonth()-1))
var date2=new Date(time);
var year=date2.getFullYear()
var month=date.getMonth();
..
若有收获，就点个赞吧
0 人点赞
