杂记整理一：javascript, jQuery 以及 ECMAscript

Posted 2020-09-27 shiningsun

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了杂记整理一：javascript, jQuery 以及 ECMAscript相关的知识，希望对你有一定的参考价值。

得到对象的键名：

var arr={a:12,b:34,c:534,d:3344};
var srr=[];

var i=0;
for(var items in arr){
srr[i]=items;i++;
}


// srr=["a", "b", "c", "d"];

jquery操作cookie

$.cookie(’name’, ‘value’, {expires: 7, path: ‘/’, domain: ‘jquery.com’, secure: true});

jquery 阻塞超链接执行，button等同效

$(‘.a‘).click(function(e){
e.preventDefault();
});

jQuery选择器： name^=‘aaa‘ 是以aaa为开头查找，匹配 aaa, aaab, aaaacd, aaa_etc

jQuery(haha).find("input[title],select[title][name^=‘DATA_‘],textarea[title]")
jQuery(haha).find("input[type=hidden]:gt(5):lt(19)")

数组转换字符串

var arr = [ "a", "b", "c", "d", "e" ];

var ss=arr.join(", ");

ss="a, b, c, d, e"

javascript 生成定长的62进制随机码（0-9, a-z, A-Z）

function getRandom(param){
　　str=[  "0","1","2","3","4","5","6","7","8","9",
　　　　　　"a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z",
　　　　　　"A","B","C","D","E","F","G","H","I","J","K","L","M","N","O","P","Q","R","S","T","U","V","W","X","Y","Z"];
　　key = "";

　　for(i=0;i<param;i++)
　　{
　　　　key += str[Math.floor(Math.random()*61)]; //1-62 //生成php随机数
　　}
　　return key;
}
getRandom(32);

javascript 复制对象，直接赋值只是引用地址，修改一个另一个也会有影响，如果要不影响的话要用new Object(obj)来生成

var s1={name:1};
var s2=s1;
//s2={name:1},s1={name:1};

s1.name=2;
s1={name:2},s2={name:2};

//s1 s2指向同一个地址

var s1={name:1};
var s2=new Object(s1);
//s2={name:1},s1={name:1};
s1.name=2;
//s2={name:1},s1={name:1};

字符串替换，repalce只能换第一个，如果要全部换要用正则

var string = "john john";
console.log(string.replace(/hn/, "ana")); // "joana john"
console.log(string.replace(/hn/g, "ana")); // "joana joana"

stringify把javascript对象转换成json字符串

parse把json字符串转换成javascript对象，如果 parse不行就用eval()，但eval有风险，会执行function

JSON.stringify();
JSON.parse();

监听键盘事件：下面有部分对照表

ESC 27

A 65

B 66

...

Z 90

shift 16

ctrl 17

alt 18

win 91

.on(‘keydown‘, function (e) {
    //do sth
})

javascript 判断元素是否在数组中（有，返回index，没有，返回-1）

function in_array(str, arr) {
    length = arr.length
    for (var i = 0; i < length; i++) {
        if (str === arr[i]) {
            return i;
        }
    }
    return -1;
}

setTimeout 会开启新的线程，有时候可以直接用do while监听

do{}while(jQuery("#flow_id option").length==0)

window.open，打开一个新的页面，这个新开的页面可以通过js去关掉

参数表：

height	高
width	宽
top	距屏顶
left	距屏左
toolbar	工具条
menubar	菜单条
scrollbars	滚动条
resizable	调整大小
location	地址栏
status	状态样

window.open (‘page.html‘,‘newwindow‘,‘height=100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no, resizable=no,location=no, status=no‘)

IE5 position:fixed;

一定要使用旧标准的html文档。不然fixed失效。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head></head>
<body></body>
</html>

旧IE 模拟placeholder：

<input name="name" id="name" onFocus="if (value ==‘学生姓名‘){value =‘‘}" onBlur="if (value ==‘‘){value=‘学生姓名‘}" required />

js 计数器，然后每次直接c1();就能进行计数了。

function create_a_counter()
{
var count = 0;
return function(){
count = count +1;
return count;
}

}

var c1=create_a_counter();

上面的计数器改进代码，构造化：

function counter(){
    var count = 0;
    function doplus(){
        count=count+1;return count;
    }
    function dominus(){
        count = count-1;return count;
    }

    var publicAPI={
        plus:doplus,minus:dominus
    }

    return publicAPI;
}

动态加载js代码：

function InsertJs(strUrl ,fOnload) {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = strUrl;
    script.charset = "UTF-8";
    if (fOnload) { script.onload = fOnload; }
    document.body.appendChild(script);
}

 InsertJs("http://xxx.com/js/test.js");

js实现文字超出部分用省略号代替

function cutString(str, len) {
   //length属性读出来的汉字长度为1
   if(str.length*2 <= len) {
      return str;
   }
   var strlen = 0;
   var s = "";
   for(var i = 0;i < str.length; i++) {
      s = s + str.charAt(i);
      if (str.charCodeAt(i) > 128) {
         strlen = strlen + 2;
         if(strlen >= len){
            return s.substring(0,s.length-1) + "...";
         }
      } else {
         strlen = strlen + 1;
         if(strlen >= len){
            return s.substring(0,s.length-2) + "...";
         }
      }
   }
   return s;
}

具体实现

function jcutstring(obj, limit){
    var len = obj.length;
    for(i=0 ;i<len; i++){
        obj.eq(i).text(cutString(obj.eq(i).text(), limit));
    }
};
$(document).ready(function(){
    var href = $(".aaa");
    jcutstring(href, 30);
});

window.haha 是个对象，在chrome中的console打 haha 与 window.haha 出来的都是function haha的定义。

所以以下三行其实是一样的，可以通过这种方法动态调用函数

haha();
window.haha();
window["haha"]();

js 检查js css是否加载

function isInclude(name){
    var js= /js$/i.test(name);
    var es=document.getElementsByTagName(js?‘script‘:‘link‘);
    for(var i=0;i<es.length;i++)
    if(es[i][js?‘src‘:‘href‘].indexOf(name)!=-1)return true;
    return false;
}

不能右键与选中的网页解决方法：

把以下代码复制到地址栏中：

javascript:document.oncontextmenu=new Function("event.returnValue=true;");document.onselectstart=new Function("event.returnValue=true;");

jQuery HTML 转义

jQuery.parseHTML(cnt)

js 去重排序，对定范围的序列进行排序时，效率不错。

function notsort(list){
   var haha=[],result=[];

   for(var i=0;i<list.length;i++){
      haha[list[i]]=list[i];
   }

   for(var i=0;i<haha.length;i++){
      if(haha[i]){
         result.push(haha[i]);
      }
   }

   return result;
}

以上是关于杂记整理一：javascript, jQuery 以及 ECMAscript的主要内容，如果未能解决你的问题，请参考以下文章

杂记整理三：phpthinkphhp和sql

杂记整理二：linux与程序安装

jQuery知识整理

react 杂记

Java Web开发——HTML CSS JavaScript 杂记

jq杂记