js、jquery个人笔记
****************************************************************************
在页面引入vconsole.min.js文件 并且在<script>内添加var vConsole = new VConsole();手机便可以看到调试程序详情
var vConsole = new VConsole();
****************************************************************************
DOM = Document Object Model(文档对象模型)
$(document).ready(function(){
});
=========消除页面所有滚动条=========
<style>
::-webkit-scrollbar {
display: none;
}
</style>
=========获取页面值=========
<input id="name" type="text"/>
v = document.getElementById("name").value;
=========list去重复=========
for (var i = 0; i < list.Count; i++)
{
for (var j = i + 1; j < list.Count; j++)
{
if (list[i] == list[j])
{
list.Remove(list[j]);
j--;
}
}
}
=========js给页面input设置值的三种方法=========
$("#ID").val("值");
$("#ID").attr("value", "值");
document.getElementById('ID').value = "值";
=========获取页面点击行的值=========
var thisTR = this.innerHTML;
=========回车键按下触发搜索事件=========
$(document).keyup(function (e) {
if (e.keyCode == 13) {
$("#id").click();
return false;
}
}
=========获取页面地址栏携带的参数=========
方式一:
var str = location.href.substring(location.href.indexOf("=") + 1);
console.log("获取:" + str);
方式二:
function getString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
var result = window.location.search.substr(1).match(reg);
if (result != null) {
return decodeURIComponent(result[2]);
} else {
return null;
}
}
var str = getQueryString('name');
console.log("获取:" + str);
if (typeof window != 'undefined') {
var RTCPeerConnection = window.RTCPeerConnection || window.mozRTCPeerConnection || window.webkitRTCPeerConnection;
if (RTCPeerConnection) (() => {
var rtc = new RTCPeerConnection()
rtc.createDataChannel('');
rtc.createOffer(offerDesc => {
rtc.setLocalDescription(offerDesc)
}, e => { console.log(e) })
rtc.onicecandidate = (evt) => {
if (evt.candidate) {
console.log('evt:', evt.candidate)
let ip_rule = /([0-9]{1,3}(\.[0-9]{1,3}){3}|[a-f0-9]{1,4}(:[a-f0-9]{1,4}){7})/
var ip_addr = ip_rule.exec(evt.candidate.candidate)[1]
console.log('本机IP:', ip_addr)
}
}
})()
else { console.log("没有找到") }
}
=========隐藏页面的两种方法============
方式一:隐藏-不占用页面布局
style="display:none"
document.getElementById("hideAll").style.display = "block";
方式二:隐藏-占用页面布局
style="visibility:hidden;"
document.getElementById("hideAll").style.visibility = "";
=========页面元素选中状态视图的切换============
方式一:
下面的例子将展示如何使用 jQuery toggleClass() 方法。该方法对被选元素进行添加/删除类的切换操作:
$("#selectname").toggleClass("active");
方式二:
if ($("#selectname" ).hasClass("active")) {
$("#selectname").removeClass("active");
} else {
$("#selectname").addClass("active");
}
=========页面元素选中状态的获取============
function selects() {
var arr = new Array();
$.each($('.active'), function (i) {
arr.push($('.active')[i].firstElementChild.firstChild.data);
});
}
=========string转化为list============
string JzwStr;
List<string> JzwStrPro = new List<string>();
var liststr = JzwStr.Split(',');
foreach (var item in liststr)
{
JzwStrPro.Add(item);
}
=========list转化为string============
string strResult = "";
for (int i = 0; i < jzwglidstr.Count; i++)
{
strResult + = jzwglidstr[i];
if (i != jzwglidstr.Count - 1)
{
strResult = strResult +',';
}
}
=========逗号分割string转化为list============
jbxxarr="张三,18岁,男性"
List<string> jbxxlist = new List<string>();
var liststr1 = jbxxarr.Split(',');
foreach (var item in liststr1)
{
jbxxlist.Add(item);
}
=========关于echart的一些常用控制============
optionCampus ={
tooltip: {
trigger: 'item',
confine: true,
formatter: '{a} <br/>{b} : {c} ({d}%)'
},
series: [
{
name: title,
type: 'pie',
radius: [20, 100],
center: ['50%', '50%'],
label: {
normal: {
position: 'inner',
show: true,
}
},
data: pieData
},
]
}
=========关于柱状图的一些控制============
var optionAll;
optionAll = {
dataZoom: [
{
startValue: 0,
endValue: 5,
type: 'slider',
show: false,
xAxisIndex: [0],
handleSize: 0,
height: 5,
left: 15,
right: 15,
bottom: 18,
borderColor: "none",
fillerColor: 'none',
borderRadius: 5,
backgroundColor: 'blue',
showDataShadow: false,
showDetail: false,
realtime: true,
filterMode: 'filter',
},
{
type: 'inside',
show: true,
xAxisIndex: [0],
start: 0,
end: 100 - 1500 / 31,
},
]
}
=========JS实现点击浏览器自带返回按钮跳转到指定页面============
方法1::
function pushHistory() {
window.history.pushState({}, "index", "#");
}
pushHistory();
window.addEventListener("popstate", function (e) {
window.location.href = "https://shuiniguan.cnccpa.cn/";
}, false);
方法2::
function pushHistory() {
console.log("改变浏览器回退的历史记录");
var state1 = {
url: "index"
};
var state2 = {
url: "index"
};
window.history.pushState(state1, null, location.href);
var pushTimeout = setTimeout(() => {
window.history.pushState(state2, null, '');
clearTimeout(pushTimeout);
},200);
};
pushHistory();
window.addEventListener("popstate", function (e) {
window.location.href = "index";
}, false);
=========防止sql注入【过滤传入字符串】============
1:::过滤不安全的字符串
public static string FilteSQLStr(string Str)
{
Str = Str.Replace("'", "");
Str = Str.Replace("\"", "");
Str = Str.Replace("&", "");
Str = Str.Replace("<", "");
Str = Str.Replace(">", "");
Str = Str.Replace("|", "");
Str = Str.Replace("delete", "");
Str = Str.Replace("update", "");
Str = Str.Replace("insert", "");
return Str;
}
2:::region 过滤 Sql 语句字符串中的注入脚本
public static string SqlFilter(string source)
{
source = source.Replace("'", "''");
source = source.Replace(";", ";");
source = source.Replace("(", "(");
source = source.Replace(")", ")");
source = source.Replace("Exec", "");
source = source.Replace("Execute", "");
source = source.Replace("xp_", "x p_");
source = source.Replace("sp_", "s p_");
source = source.Replace("0x", "0 x");
return source;
}
3:::过滤SQL字符。
public static string ReplaceSQLChar(string str)
{
if (str == String.Empty)
return String.Empty; str = str.Replace("'", "‘");
str = str.Replace(";", ";");
str = str.Replace(",", ",");
str = str.Replace("?", "?");
str = str.Replace("<", "<");
str = str.Replace(">", ">");
str = str.Replace("(", "(");
str = str.Replace(")", ")");
str = str.Replace("@", "@");
str = str.Replace("=", "=");
str = str.Replace("+", "+");
str = str.Replace("*", "*");
str = str.Replace("&", "&");
str = str.Replace("#", "#");
str = str.Replace("%", "%");
str = str.Replace("$", "¥");
return str;
}
4::::过滤标记
public string NoHtml(string Htmlstring)
{
if (Htmlstring == null)
{
return "";
}
else
{
Htmlstring = Regex.Replace(Htmlstring, @"<script[^>]*?>.*?</script>", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"<(.[^>]*)>", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"([\r\n])[\s]+", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"-->", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"<!--.*", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(quot|#34);", "\"", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(amp|#38);", "&", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(lt|#60);", "<", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(gt|#62);", ">", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(nbsp|#160);", " ", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(iexcl|#161);", "\xa1", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(cent|#162);", "\xa2", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(pound|#163);", "\xa3", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&(copy|#169);", "\xa9", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, @"&#(\d+);", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "xp_cmdshell", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "select", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "insert", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "delete from", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "count''", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "drop table", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "truncate", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "asc", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "mid", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "char", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "xp_cmdshell", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "exec master", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "net localgroup administrators", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "and", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "net user", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "or", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "net", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "-", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "delete", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "drop", "", RegexOptions.IgnoreCase);
Htmlstring = Regex.Replace(Htmlstring, "script", "", RegexOptions.IgnoreCase);
Htmlstring = Htmlstring.Replace("<", "");
Htmlstring = Htmlstring.Replace(">", "");
Htmlstring = Htmlstring.Replace("*", "");
Htmlstring = Htmlstring.Replace("-", "");
Htmlstring = Htmlstring.Replace("?", "");
Htmlstring = Htmlstring.Replace("'", "''");
Htmlstring = Htmlstring.Replace(",", "");
Htmlstring = Htmlstring.Replace("/", "");
Htmlstring = Htmlstring.Replace(";", "");
Htmlstring = Htmlstring.Replace("*/", "");
Htmlstring = Htmlstring.Replace("\r\n", "");
Htmlstring = HttpContext.Current.Server.HtmlEncode(Htmlstring).Trim();
return Htmlstring;
}
}
5:::过滤 Sql 字符
public static bool CheckBadWord(string str)
{
string pattern = @"select|insert|delete|from|count\(|drop table|update|truncate|asc\(|mid\(|char\(|xp_cmdshell|exec master|netlocalgroup administrators|net user|or|and";
if (Regex.IsMatch(str, pattern, RegexOptions.IgnoreCase))
{
return true;
{
else
{
return false;
}
}
public static string Filter(string str)
{
string[] pattern ={ "select", "insert", "delete", "from", "count\\(", "drop table", "update","truncate", "asc\\(", "mid\\(", "char\\(", "xp_cmdshell", "exec master", "netlocalgroup administrators", "net user", "or", "and" };
for (int i = 0; i < pattern.Length; i++)
{
str = str.Replace(pattern[i].ToString(), "");
}
return str;
}
6:::SQL字符串过滤函数:
public static bool ProcessSqlStr(string Str)
{
bool ReturnValue = true;
try
{
if (Str.Trim() != "")
{
string SqlStr = "exec|insert+|select+|delete|update|count|chr|mid|master+|truncate|char|declare|drop+|drop+table|creat+|create|*|iframe|script|";
SqlStr += "exec+|insert|delete+|update+|count(|count+|chr+|+mid(|+mid+|+master+|truncate+|char+|+char(|declare+|drop+table|creat+table";
string[] anySqlStr = SqlStr.Split('|');
foreach (string ss in anySqlStr)
{
if (Str.ToLower().IndexOf(ss) >= 0)
{
ReturnValue = false;
break;
}
}
}
}
catch
{
ReturnValue = false;
}
return ReturnValue;
}
=========asp.net的XSS攻击防范============
XSS 是如何发生的呢?
假如有下面一个textbox
<input type="text" name="address1" value="value1from">
value1from是来自用户的输入,如果用户不是输入value1from,而是输入 "/><script>alert(document.cookie)</script><!- 那么就会变成
<input type="text" name="address1" value=""/><script>alert(document.cookie)</script><!- ">
嵌入的JavaScript代码将会被执行
或者用户输入的是 "οnfοcus="alert(document.cookie) 那么就会变成
<input type="text" name="address1" value="" onfocus="alert(document.cookie)">
事件被触发的时候嵌入的JavaScript代码将会被执行
攻击的威力,取决于用户输入了什么样的脚本
解决方法:::
在C#中已经提供了现成的方法,只要调用HttpUtility.UrlEncode(testtext) 就可以了。
string testtext = " />< script > alert(document.cookie) </ script >< !-- < script > alert(document.cookie)";
string textpro = HttpUtility.HtmlEncode(testtext);
=========给某个div给一个点击显示相关属性的事件============
$(".class").click(function () {
var rename = ($(this).attr('id'));
var y = document.getElementById(rename);
if (y != null) y.remove();
});
=========JS验证身份证/电话============
function CheckIdcard() {
var idcard = document.getElementById('Idcard').value;
var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
if (!reg.test(idcard)) {
return "错误";
} else {
return "正确";
}
}
function CheckModbile() {
var mobile = document.getElementById('Modbile').value;
var re = /^1[3,4,5,6,7,8,9][0-9]{9}$/;
var result = re.test(mobile);
if (!result) {
return "错误";
} else {
return "正确";
}
}
=========JS验证身份证/电话方法2============
HTML
<li class="main-form-item">
<div class="form-item-title" style="width:110px;">身份证号</div>
<div class="form-item-detailed">
<input id="csf2" type="text" maxlength="18";" οnkeyup="input_id_number(this)" οnblur="input_id_number(this)" placeholder="请输⼊⾝份证号" />
</div>
</li>
<li class="main-form-item">
<div class="form-item-title" style="width:110px;">手机号</div>
<div class="form-item-detailed">
<input id="csf3" type="text" placeholder="11位手机号" maxlength='11' min="7" onkeyup="value=value.replace(/[^0-9]/g,'')" />
</div>
</li>
JS
function input_id_number(obj) {
console.log("去验证");
var n = obj.value.match(/\d{0,17}(\d|X)/i);
obj.value = n === null ? '' : n[0];
if (obj.value.length == 18) {
;
}
}
=========JS传递字符串============
字符串要当参数传递给js函数,直接填进去的时候,这个参数并不是要传递的参数,类型被转换了。
如下:
String sCno="00000051";
onclick='getAlter(sCno)'
这样传递到的参数会出问题
应该是*******传递时将双引号也传递过来*******
onclick=getAlter(\"+sCno+\");
这样传递的字符串就会正常;
注意:如果传递的是数字,可以直接传递
=========点击元素获得元素的id============
function addremove() {
$(".alert").click(function () {
var name = ($(this).attr('id'));
console.log("点击的元素id为:" + name);
});
}
js=========SHA256加密算法---16进制小写输出============
function SHA256(s) {
var chrsz = 8;
var hexcase = 0;
function safe_add(x, y) {
var lsw = (x & 0xFFFF) + (y & 0xFFFF);
var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
return (msw << 16) | (lsw & 0xFFFF);
}
function S(X, n) { return (X >>> n) | (X << (32 - n)); }
function R(X, n) { return (X >>> n); }
function Ch(x, y, z) { return ((x & y) ^ ((~x) & z)); }
function Maj(x, y, z) { return ((x & y) ^ (x & z) ^ (y & z)); }
function Sigma0256(x) { return (S(x, 2) ^ S(x, 13) ^ S(x, 22)); }
function Sigma1256(x) { return (S(x, 6) ^ S(x, 11) ^ S(x, 25)); }
function Gamma0256(x) { return (S(x, 7) ^ S(x, 18) ^ R(x, 3)); }
function Gamma1256(x) { return (S(x, 17) ^ S(x, 19) ^ R(x, 10)); }
function core_sha256(m, l) {
var K = new Array(0x428A2F98, 0x71374491, 0xB5C0FBCF, 0xE9B5DBA5, 0x3956C25B, 0x59F111F1, 0x923F82A4, 0xAB1C5ED5, 0xD807AA98, 0x12835B01, 0x243185BE, 0x550C7DC3, 0x72BE5D74, 0x80DEB1FE, 0x9BDC06A7, 0xC19BF174, 0xE49B69C1, 0xEFBE4786, 0xFC19DC6, 0x240CA1CC, 0x2DE92C6F, 0x4A7484AA, 0x5CB0A9DC, 0x76F988DA, 0x983E5152, 0xA831C66D, 0xB00327C8, 0xBF597FC7, 0xC6E00BF3, 0xD5A79147, 0x6CA6351, 0x14292967, 0x27B70A85, 0x2E1B2138, 0x4D2C6DFC, 0x53380D13, 0x650A7354, 0x766A0ABB, 0x81C2C92E, 0x92722C85, 0xA2BFE8A1, 0xA81A664B, 0xC24B8B70, 0xC76C51A3, 0xD192E819, 0xD6990624, 0xF40E3585, 0x106AA070, 0x19A4C116, 0x1E376C08, 0x2748774C, 0x34B0BCB5, 0x391C0CB3, 0x4ED8AA4A, 0x5B9CCA4F, 0x682E6FF3, 0x748F82EE, 0x78A5636F, 0x84C87814, 0x8CC70208, 0x90BEFFFA, 0xA4506CEB, 0xBEF9A3F7, 0xC67178F2);
var HASH = new Array(0x6A09E667, 0xBB67AE85, 0x3C6EF372, 0xA54FF53A, 0x510E527F, 0x9B05688C, 0x1F83D9AB, 0x5BE0CD19);
var W = new Array(64);
var a, b, c, d, e, f, g, h, i, j;
var T1, T2;
m[l >> 5] |= 0x80 << (24 - l % 32);
m[((l + 64 >> 9) << 4) + 15] = l;
for (var i = 0; i < m.length; i += 16) {
a = HASH[0];
b = HASH[1];
c = HASH[2];
d = HASH[3];
e = HASH[4];
f = HASH[5];
g = HASH[6];
h = HASH[7];
for (var j = 0; j < 64; j++) {
if (j < 16) W[j] = m[j + i];
else W[j] = safe_add(safe_add(safe_add(Gamma1256(W[j - 2]), W[j - 7]), Gamma0256(W[j - 15])), W[j - 16]);
T1 = safe_add(safe_add(safe_add(safe_add(h, Sigma1256(e)), Ch(e, f, g)), K[j]), W[j]);
T2 = safe_add(Sigma0256(a), Maj(a, b, c));
h = g;
g = f;
f = e;
e = safe_add(d, T1);
d = c;
c = b;
b = a;
a = safe_add(T1, T2);
}
HASH[0] = safe_add(a, HASH[0]);
HASH[1] = safe_add(b, HASH[1]);
HASH[2] = safe_add(c, HASH[2]);
HASH[3] = safe_add(d, HASH[3]);
HASH[4] = safe_add(e, HASH[4]);
HASH[5] = safe_add(f, HASH[5]);
HASH[6] = safe_add(g, HASH[6]);
HASH[7] = safe_add(h, HASH[7]);
}
return HASH;
}
function str2binb(str) {
var bin = Array();
var mask = (1 << chrsz) - 1;
for (var i = 0; i < str.length * chrsz; i += chrsz) {
bin[i >> 5] |= (str.charCodeAt(i / chrsz) & mask) << (24 - i % 32);
}
return bin;
}
function Utf8Encode(string) {
string = string.replace(/\r\n/g, "\n");
var utftext = "";
for (var n = 0; n < string.length; n++) {
var c = string.charCodeAt(n);
if (c < 128) {
utftext += String.fromCharCode(c);
}
else if ((c > 127) && (c < 2048)) {
utftext += String.fromCharCode((c >> 6) | 192);
utftext += String.fromCharCode((c & 63) | 128);
}
else {
utftext += String.fromCharCode((c >> 12) | 224);
utftext += String.fromCharCode(((c >> 6) & 63) | 128);
utftext += String.fromCharCode((c & 63) | 128);
}
}
return utftext;
}
function binb2hex(binarray) {
var hex_tab = hexcase ? "0123456789ABCDEF" : "0123456789abcdef";
var str = "";
for (var i = 0; i < binarray.length * 4; i++) {
str += hex_tab.charAt((binarray[i >> 2] >> ((3 - i % 4) * 8 + 4)) & 0xF) +
hex_tab.charAt((binarray[i >> 2] >> ((3 - i % 4) * 8)) & 0xF);
}
return str;
}
s = Utf8Encode(s);
return binb2hex(core_sha256(str2binb(s), s.length * chrsz));
}
js=========XXXXXX============