javascript js知识锦集，正则表达式， jQuery去除空格 js获取当前域名和端口号以及完整URL
JavaScript获取当天的域名、端口
window.location.protocol+"//"+window.location.host; // 返回https://mp.csdn.net
window.location.host; //返回url 的主机部分，例如：mp.csdn.net
window.location.hostname; //返回mp.csdn.net
window.location.href; //返回整个url字符串(在浏览器中就是完整的地址栏)
window.location.pathname; //返回/a/index.php或者/index.php
window.location.protocol; //返回url 的协议部分，例如： http:，ftp:，maito:等等。
window.location.port //url 的端口部分，如果采用默认的80端口，那么返回值并不是默认的80而是空字符
一、js获取当前项目域名
var domain = document.domain; // http://www.baidu.com
var domain = window.location.host;
二、获取项目端口号
var port = location.port; //获取端口号 8080
var host = location.host; //获取主机名+端口号 例如：192.168.0.1:8080
三、获取当前项目URL
URL指的是浏览器的地址栏的网址，其中包括域名+端口号+当前页面的路由,例如： http://www.baidu.com：8080/home/index？a=0&&b=1
var url = window.location.href;
var url = self.location.href;
var url = document.URL;
var url = document.location;
四、获取当前项目域名+端口+路由
在支付宝支付开发中，遇到需要传url给后端，支付成功后需要跳到自己项目之前的订单页面，这时候用类似 var url = window.location.href;获取url的方法，会出现一个问题，会把后面？后面的参数也带过去，其实我们并不需要后面的参数，我们需要如下： http://www.baidu.com：8080/home/index这种格式，下面的方法可以处理：
const routerIndex = window.location.href.indexOf('?'); // 判断URL后面有没有参数
const url = window.location.href.slice(0, routerIndex > 0 ? routerIndex : window.location.href.length); // 截取元素URL，获取我们需要的URL地址
————————————————
原文链接：https://blog.csdn.net/qq_40657321/article/details/106332441JavaScript捕获回车键
window.onload = function (){
document.getElementById("mytext").onkeydown = function (event){
if (event.keyCode == 13)
alert("点击了回车！");
}
}
————————————————
var timeoutId;
var highlightindex = -1;
var swd1;
$(function() {
$("#srhkey").keyup(function(event) {
var myEvent = event || window.event;
var keyCode = myEvent.keyCode;
if (keyCode >= 65 && keyCode <= 90 || keyCode >= 48 && keyCode <= 57 || keyCode >= 96 && keyCode <= 111 || keyCode >= 186 && keyCode <= 222 || keyCode == 8 || keyCode == 46 || keyCode == 32) {
// keycode 65~90 字母abc 48-57 数字1-9和其上档键 96-111数字键盘和功能按键 186-222 符号按键 8退格键 删除 46 delete删除键 32空格按键
// srchsug();
searchword = $("#srhkey").val();
// console.log(searchword);
if(searchword){
searchword = searchword.trim();
// 关键词预测
forecast(searchword);
// 去掉末尾空格 避免重复请求
if((searchword != swd1) && (searchword.length < 20)){
srchsug();
swd1 = searchword;
}
}
if (highlightindex != -1) {
highlightindex = -1;
}
} else {
if (keyCode == 38 || keyCode == 40) {
if (keyCode == 38) {
// Up 键盘向上选择
var autoNodes = $("#auto").children("div");
if (highlightindex != -1) {
autoNodes.eq(highlightindex).css("background-color", "white");
highlightindex--
} else {
highlightindex = autoNodes.length - 1;
}
if (highlightindex == -1) {
highlightindex = autoNodes.length - 1;
}
autoNodes.eq(highlightindex).css("background-color", "#ebebeb");
var comText = autoNodes.eq(highlightindex).text();
// 选择关键词后也进行预测
$("#srhkey").val(comText);
forecast(comText);
}
if (keyCode == 40) {
// Down向下选择
var autoNodes = $("#auto").children("div");
if (highlightindex != -1) {
autoNodes.eq(highlightindex).css("background-color", "white")
}
highlightindex++;
if (highlightindex == autoNodes.length) {
highlightindex = 0
}
autoNodes.eq(highlightindex).css("background-color", "#ebebeb");
var comText = autoNodes.eq(highlightindex).text();
$("#srhkey").val(comText);
// 选择关键词后也进行预测
forecast(comText);
}
} else {
if (keyCode == 27) {
// 27 Escape 取消按键
if ($("#auto").is(":visible")) {
$("#auto").hide();
}
}
}
}
});
document.onclick = function(e) {
var e = e ? e: window.event;
var tar = e.srcElement || e.target;
if (tar.id != "srhkey") {
if ($("#auto").is(":visible")) {
$("#auto").css("display", "none")
}
};
// 鼠标轩中后预测
forecast($("#srhkey").val());
// 鼠标选中后 手点选项后 翻译
get_youdao_data($("#srhkey").val());
}
});JavaScript 随机正数或负数
我需要创建一个随机-1或1来乘以一个已经存在的数字。问题是我目前的随机函数产生-1,0或1.这样做的最有效方法是什么？
用 Math.random()即可。如果< 0.5，那么-1，否则1：
表达式1：
var plusOrMinus = Math.random() < 0.5 ? -1 : 1;
表达式2：
Math.round(Math.random()) * 2 - 1
Math.random()会给你[0,1]，
小于0.5，三目运算结果为true，那就取值-1，
大于0.5，三目运算结果为false，那就取值1。
Math.round(Math.random())会给你0或1，
乘以2的结果会给你0或2，
再减去1给你-1或1。
https://blog.csdn.net/mChales_Liu/article/details/106287904
前端基础JS——input输入框的oninput事件和onchange事件
<input type="text" oninput="getValue();" id="inputbtn"/>
<p id="inputcont"></p>
<script type="text/javascript">
function getValue(){
var btn = document.getElementById("inputbtn");
var box = document.getElementById("inputcont");
box.innerHTML = btn.value;
}
</script>
在开发过程中，input用的比较多的是change事件，忽略了还有input事件。
onchange——input输入过程中不会触发，失去焦点时才会触发；
兼容性：所有浏览器都支持，可以用于<input>, <select>, 和 <textarea>元素。
oninput——在用户输入时触发，它是在元素值发生变化时立即触发；实时触发
缺陷：从脚本中修改值不会触发事件。从浏览器下拉提示框里选取值时不会触发。IE9 以下不支持，所以IE9以下可用onpropertychange 事件代替。
链接：https://blog.csdn.net/WXY19951125/article/details/84871276JavaScript键盘鼠标事件 keycode对照表 https://blog.csdn.net/Sheng_zhenzhen/article/details/106797855
JavaScript获取时间戳
new Date().getTime(); //1603009495724,精确到毫秒
new Date().valueOf(); //1603009495724.精确到毫秒
Date.parse(new Date()); //1603009257000,精确到秒
Date.parse() 方法解析一个表示某个日期的字符串，并返回从1970-1-1 00:00:00 UTC 到该日期对象（该日期对象的UTC时间）的毫秒数，如果该字符串无法识别，或者一些情况下，包含了不合法的日期数值（如：2015-02-31），则返回值为NaN。
不推荐在ES5之前使用Date.parse方法，因为字符串的解析完全取决于实现。直到至今，不同宿主在如何解析日期字符串上仍存在许多差异，因此最好还是手动解析日期字符串（在需要适应不同格式时库能起到很大帮助
原文链接：https://blog.csdn.net/weixin_46021847/article/details/109146476
javascript 对象是否存在
目标：if (myObj不存在){
声明myObj;
}
方法一：如果不存在则创建
if (!myObj) {
var myObj = { };
}
方法二： 这是目前使用最广泛的判断javascript对象是否存在的方法。
if (typeof myObj == "undefined") {
var myObj = { };
}
JavaScript正则表达式
JavaScript正则表达式匹配：不包含某字符或字符串
匹配不包含问号的字符串，采用如下正则表达式：/^[^\?]*$/
其中：^是开头，$是结尾;^是非;\? 问号转义;*允许空值;
不包含某字符串（如“hit”）需要特殊处理，不然他会把字母都拆开，去分别判断“h”、“i”、“t”，
/^.*hit.*$/
/^((?!hit).)*$/
应用：比如想把history模式的路由改为哈希模式，在/hit/后面加#，
就可以这样来替换x=x.replace(/\/hit\//gi, "/hit/#");
https://blog.csdn.net/a704386029/article/details/122093276
js构造正则表达式
方式1：字面量创建
var reg = /正则表达式/修饰符；
方式2：构建函数创造
var reg = new RegExp('正则表达式','修饰符')
修饰符
i: ignoreCase, 匹配忽视大小写
m: multiline , 多行匹配
g: global , 全局匹配
// re = new RegExp("(kw)|\\d+|方", "g", "m", "i");
// mystr += "<br>replace：" + kw_f1.replace(re, " 替换：");
// mystr += "<br>match：" + kw_f1.match(re);
;
正则表达式调用方法
1. exec： 匹配字符串和正则表达式的方法，匹配成功：返回一个数组 [匹配内容,index:匹配的起始位置,input:要匹配的字符串, group:undefined]，匹配失败，返回null
var str = 'hello world hello';
var reg = /hello/g;
console.log(reg.exec(str)) //返回[ 'hello', index: 0, input: 'hello world hello', groups: undefined ]
2 test 测试待检测的字符串是或否能匹配到，匹配到返回true，否则返回false
// mystr += "<br>test：" + re.test(kw_f1);
// mystr += "<br>t<p>e<p>s<p>t<p>：<p>"
3.match 返回数组列表
4.search 返回首个对象
JavaScript正则表达式字符含义
\d [0-9] 数字字符
\D [^0-9] 非数字字符
\w 匹配包括下划线的任何单个字符，包括AZ，az，0~9和下划线**""**，等效于[a-zA-Z0-9] 取反：\W
\s 匹配任何Unicode空白字符，包括空格、制表符、换页符等，等效于[\f\t\n\r]
^表示匹配开始的字符
$表示匹配结束位置的字符
* >=0次
+ ≥1 次
？ 0或1次
{n} n 次
{n,} ≥n 次
{n,m} n到m 次
https://blog.csdn.net/weixin_50698273/article/details/124957421
Js 正则表达式匹配字符串中是否含有中文
通常在特定的情景里，有的字符串是不允许存在中文字符的，因此我们可以通过正则表达式来匹配。废话不多说，上代码
function checkChinese(obj_val){
var reg = new RegExp("[\\u4E00-\\u9FFF]+","g");
if(reg.test(obj_val)){
alert('字符串中含有中文');
}
}
应用：
// url 提取
if((kw_f.match("https?:\/\/.*[^s]", "i"))){
// 链接提取
let new_url = kw_f.match(/(https?:\/\/.*)/img)[0];
new_url = new_url.replace(/(?:[\u4E00-\u9FFF]|\s).*/imgs, '');
// 遇到中文，空格，等开始，后面都不要了
// console.log(new_url);
js去除空格的方式
1. replace正则匹配方法
去除字符串内所有的空格：str = str.replace(/\s*/g,"");
var str = " 6 6 ";
var str_1 = str.replace(/\s*/g,"");
console.log(str_1); //66
去除字符串内两头的空格：str = str.replace(/^\s*|\s*$/g,"");
var str = " 6 6 ";
var str_1 = str.replace(/^\s*|\s*$/g,"");
console.log(str_1); //6 6//输出左右侧均无空格
去除字符串内左侧的空格：str = str.replace(/^\s*/,"");
var str = " 6 6 ";
var str_1 = str.replace(/^\s*/,"");
console.log(str_1); //6 6 //输出右侧有空格左侧无空格
去除字符串内右侧的空格：str = str.replace(/(\s*$)/g,"");
var str = " 6 6 ";
var str_1 = str.replace(/(\s*$)/g,"");
console.log(str_1); // 6 6//输出左侧有空格右侧无空格
2. str.trim()方法
trim()方法是用来删除字符串两端的空白字符并返回，trim方法并不影响原来的字符串本身，它返回的是一个新的字符串。
缺陷：只能去除字符串两端的空格，不能去除中间的空格
单独去除左侧空格则使用 str.trimLeft();
单独去除右侧空格则使用 str.trimRight();
var str = " 6 6 ";
var str_1 = str.trim();
console.log(str_1); //6 6//输出左右侧均无空格
jQuery方法：$.trim(str)方法
$.trim() 函数用于去除字符串两端的空白字符。
var str = " 6 6 ";
var str_1 = $.trim(str);
console.log(str_1); //6 6//输出左右侧均无空格
注意：$.trim() 函数会移除字符串开始和末尾处的所有换行符，空格(包括连续的空格)和制表符。如果这些空白字符在字符串中间时，它们将被保留，不会被移除。
————————————————
https://www.cnblogs.com/a-cat/p/8872498.html
js 匹配URL的正则表达式
获取字符串中所有 a 标签的 href 的值及其中间的文本内容
const linkReg = /<a href="(.*)">(.*)<\/a>/ig;
const linkArray = [];
str.replace(linkReg, (...args) => linkArray.push({ href: args[1], text: args[2] }));
console.log(linkArray);
匹配所有的 img 标签的 src 的值
const imgArray = [];
const imgReg = /(<img.*src="(.*?)".*\/?>)/ig;
str.replace(imgReg, (...args) => imgArray.push(args[2]));
// ---- 或者 ----
const imgArray2 = [];
let match = null;
do {
match = imgReg.exec(str);
match && imgArray2.push(match[2]);
} while (match);
// 两种方式的结果是一样的
console.log(imgArray);
console.log(imgArray2);
匹配出所有的字符串中所有的URL, 不区分html标签
const urlReg = /['"](https?:\/\/.*?)["']$?/ig;
const urlArrray = str.match(urlReg);js 使用正则表达式验证url地址
/(https?|ftp|file)://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]/imgs
js 最新手机号码、电话号码正则表达式
/^1[3-9]\d{9}$/imgs
JavaScript查找字符串 案例
<script type="text/javascript">
var str='https:// k w _f w w 京东 .m 比基尼 i 淘宝 SH57815296067758348975 a o v. com m/2 0 192.168.1.1、127.0.0.1a 1 3 地 15296067758方 localhost.mp4.m3u8';
// var str='152967897758';
//查找字符串
//alert(str.indexOf('m'));
//从第几位开始找
//alert(str.indexOf('m',5));
var strr="时间：吕肉丝是可爱的狗";
//截取字符串
var mystr = strr.substring(0,3);
mystr += new Date();
// $("#testjs").html((strr.substring(0,3)));
forecast(str);
var kw_match="", kw_res="";
function forecast(kw_f){
$(document).ready(function(){
mystr += "<br>" + "kwf:" + kw_f;
kw_f1 = kw_f.replace(/\s*/g,"");
// 正则表达式去掉所有空格
mystr += "<br>" + "kw_f1去掉空格:" + kw_f1;
try{
var arr_forecast = new Array();
// url http开头的
if(kw_f1.match('^https?:\/\/', "i", "g", "m")){
// url http开头
arr_forecast.push({"ock": "o_s_url(this)", "base_url": kw_f1.match(/^https?:\/\/.*/img), "btn_text": "打开链接", "short_text": "打开"})}
// url http开头的
if(/\.mp4$|\.m3u8$|\.mp3$|\.avi$/imgs.test(kw_f1)){
// url http开头
// url http开头
arr_forecast.push({"ock": "o_s_url(this)", "base_url": ("baseplayurl:+ " + kw_f1), "btn_text": "在线播放", "short_text": "播放"})}
// url 提取
if((kw_f.match("https?:\/\/.*[^s]", "i"))){
// url http开头
arr_forecast.push({"ock": "o_s_url(this)", "base_url": kw_f1.match(/(https?\:\/\/.*?\.(?:com.cn|com|co|cn|net|org|edu|top|vip|online|tech|tv|la|us|cc|xyz|site|art|en|link|biz|in).*?)/img), "btn_text": "链接提取", "short_text": "提取"})}
if(/\.co|\.cn|\.net|\.org|\.edu|\.top|\.vip|\.online|\.tech|\.tv|\.la|\.us|\.cc|\.xyz|\.site|\.art|\.en|\.link|\.biz|\.in/img.test(kw_f1)){
// 域名
arr_forecast.push({"ock": "o_s_url(this)", "base_url": ("https://" + kw_f1), "btn_text": "访问域名", "short_text": "访问"})}
if(kw_f1.match('192\.168\.|127\.0\.|localhost', "i", "g", "m")){
// 本地站点
arr_forecast.push({"ock": "o_s_url(this)", "base_url": ("https://" + kw_f1), "btn_text": "本地站点", "short_text": "测试"})}
if((/\d{9}/imsg.test(kw_f1))){
arr_forecast.push({"ock": "o_s_url(this)", "base_url": kw_f1.match(/\d{9,}/img)[0], "btn_text": "快递查询", "short_text": "快递"})}
if((/1(3|4|5|6|7|8|9)\d{9}/.test(kw_f1))){
arr_forecast.push({"ock": "o_s_url(this)", "base_url": kw_f1.match(/(1(3|4|5|6|7|8|9)\d{9})/img)[0], "btn_text": "电话查询", "short_text": "电话"})}
if((/淘宝|天猫|拼多多/imsg.test(kw_f1))){
if((/京东|京喜|网上商城/imsg.test(kw_f1))){
if((/pic|image|img|findimg|花瓣|婚纱|景观|图|照|素材|背景|画面|纹理|桌面|相片|壁纸|头像|手抄报|美女|清纯|性感|漂亮|唯美|比基尼|异域|美腿|唯美|风景|星空|简约|个性|古风|女人|帅|哥|姐|明星|模特|豪车|集美|写真|长腿/imsg.test(kw_f1))){
arr_forecast.push({"ock": "o_s_url(this)", "base_url": kw_f1.match(/(1(3|4|5|6|7|8|9)\d{9})/img)[0], "btn_text": "图片搜索", "short_text": "图片"})}
mystr += "<br> <p> <p> <p> <p> <p> <p>" + "数组：<br>";
for (i in arr_forecast){
mystr += "<p>" + arr_forecast[i].btn_text + " " + arr_forecast[i].base_url;
$(("#srhbt66"+i)).html(arr_forecast[i].short_text);
if (i==0){}}
mystr += "<br><p>数组完：<br>" +"<br> <p> <p> <p> <p> <p> <p>";
re = new RegExp("(kw)|\\d+|方", "g", "m", "i");
mystr += "<br>replace：" + kw_f1.replace(re, " 替换：");
mystr += "<br>match：" + kw_f1.match(re);
// test 测试待检测的字符串是或否能匹配到，匹配到返回true，否则返回false
mystr += "<br>test：" + re.test(kw_f1);
mystr += "<br>t<p>e<p>s<p>t<p>：<p>";}catch(e){
mystr += "<br>" + "err:" + e;}
$("#testjs").html(mystr);})}
function forecast_test(kw_f){
$(document).ready(function(){
mystr += "<br>" + "kwf:" + kw_f;
kw_f1 = kw_f.replace(/\s*/g,"");
// 正则表达式去掉所有空格
//
mystr += "<br>" + "kw_f1去掉空格:" + kw_f1;
let url_pattern = "/^(https?:\/\/)([0-9a-z.]+)(:[0-9]+)?([/0-9a-z.]+)?(\?[0-9a-z&=]+)?(#[0-9-a-z]+)?/i";
// var strRegex = "^((https|http|ftp|rtsp|mms)?://)"
// + "?(([0-9a-z_!~*'().&=+$%-]+: )?[0-9a-z_!~*'().&=+$%-]+@)?" //ftp的user@
// + "(([0-9]{1,3}\.){3}[0-9]{1,3}" // IP形式的URL- 199.194.52.184
// + "|" // 允许IP和DOMAIN（域名）
// + "([0-9a-z_!~*'()-]+\.)*" // 域名- www.
// + "([0-9a-z][0-9a-z-]{0,61})?[0-9a-z]\." // 二级域名
// + "[a-z]{2,6})" // first level domain- .com or .museum
// + "(:[0-9]{1,4})?" // 端口- :80
// + "((/?)|" // a slash isn't required if there is no file name
// + "(/[0-9a-z_!~*'().;?:@&=+$,%#-]+)+/?)$";
// kw_res = url_match.exec(kw_f1);
try{
const urlReg = /(https?:\/\/)?([\da-z\.-]+)\.([a-z\.]{2,6})([\/\w \.-]*)*\/?/ig;
const urlArrray = kw_f1.match(urlReg);
mystr += "<br> <p> </p> <p> </p>" + "urlArrray:" + urlArrray;
var strRegex ='(https?|ftp|file)://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]';
mystr += "<br>" + "strRegex:" + kw_f.match(strRegex);
if(kw_f1.match(strRegex)){
mystr += "<br>" + "恭喜你匹配成功";};
var strRegex = new RegExp('(https?|ftp|file)://[-A-Za-z0-9+&@#/%?=~_|!:,.;]+[-A-Za-z0-9+&@#/%=~_|]');
mystr += "<br>" + "strRegex test:" + strRegex.test(kw_f);
re = new RegExp("(kw)|\\d+|方", "g", "m", "i");
mystr += "<br>replace：" + kw_f1.replace(re, " 替换：");
mystr += "<br>match：" + kw_f1.match(re);
mystr += "<br>search：" + kw_f1.search(re);
// exec
// 返回一个数组 [匹配内容,index:匹配的起始位置,input:要匹配的字符串, group:undefined]
// 匹配失败:
// 返回null
mystr += "<br>exec：" + re.exec(kw_f1);
// test 测试待检测的字符串是或否能匹配到，匹配到返回true，否则返回false
mystr += "<br>test：" + re.test(kw_f1);
mystr += "<br>lastIndex：" + re.lastIndex;}catch(e){
mystr += "<br>" + "err:" + e;}
$("#testjs").html(mystr);})}
/*
if(
if(preg_match('/http/i',
preg_match_all("/https?:\/\/[\w-.%#?\/\\\]+/i",
//print_r(
foreach(
{}
echo
// 媒体地址文件
if(preg_match('/\.mp4/i',}elseif(preg_match('/\.m3u8/i',}elseif(preg_match('/\.mp3/i',}elseif(preg_match('/\.avi/i',}else{};}elseif(preg_match('/\.co|\.cn|\.net|\.org|\.edu|\.top|\.vip|\.online|\.tech|\.tv|\.la|\.us|\.cc|\.xyz|\.site|\.art|\.en|\.link|\.biz|\.in/i',
if(preg_match('/www/i',}}elseif(preg_match('/192\.168\.|127\.0\.|localhost/i',
// 本地服务器地址}elseif(preg_match('/^1[3456789]\d{9}$/ims',
// 电话号码 区号查询}elseif(preg_match('/\d{9}/ims',
// 超过9位数的数字 快递查询，顺丰不需要登陆，内容是菜鸟裹裹提供的，准确度高，时效快}elseif(preg_match('/淘宝|天猫|拼多多/i',
// 淘宝购物}elseif(preg_match('/京东|京喜|网上商城/i',
// 京东购物}elseif(preg_match('/比价|购物|值得|便宜/i',
// 慢慢买 比价}elseif(preg_match('/百科|baike|近义词|反义词|词语出处|成语出处|拼音|典故|成语故事|成语寓意|词语典故|词语寓意|词语运用|成语运用|词语用法|成语用法|成语辨析|词语辨析|词语注释|古诗/i',
// 百科}elseif(preg_match('/豆瓣|影评|douban/i',
// 豆瓣}elseif(preg_match('/有限公司$|有限责任公司$/i',
// 企业信息查询
$rand = rand(1,
$url = $urla[($rand - 1)];}elseif(preg_match('/App|apk|应用|store|手机软件|移动端|手机版|移动版|軟體|手机下载|安卓版|鸿蒙版|华为版|Android/i',
// 应用下载}elseif(preg_match('/动漫|漫画/i',
// 动漫 漫画}elseif(preg_match('/^[A-Za-z]+$|词典|单词|例句|造句|双语|句子|有道|英语/i',
// 纯字母组成的单词查询 直接进行有道词典翻译}else{};};
*/
</script>