给时光以生命

常用的js代码片段

1.单选框/手风琴

View Code

2.复选框

 1 function checkListTwo(){    //点击变换效果
 2             var li = document.getElementById("checkList").getElementsByTagName("li");
 3             for(var i=0;i){
 4                 li[i].onclick = function(){
 5                     if(this.className == 'selected'){
 6                         this.className = null;  //单击若判断已有类,再次点击选中会清空class
 7                     }else{
 8                         this.className = 'selected';
 9                     }
10                 }
11             }
12         }

View Code

3.多级导航菜单

View Code

4.获取时间，把获取到的毫秒数转换成我们需要的时间格式即可

 1 function getFormatTime(time) {
 2         var time = time  0;
 3  
 4         var h = parseInt(time/3600),
 5             m = parseInt(time%3600/60),
 6             s = parseInt(time%60);
 7         h = h < 10 ? "0"+h : h;
 8         m = m < 10 ? "0"+m : m;
 9         s = s < 10 ? "0"+s : s;
10  
11         return h+":"+m+":"+s;
12     }

View Code

5.小时钟显示

View Code

6.小写转大写

 1 
 2 
 3 
 4 
11 
12 
13 
14 
15 Enter your name: 
16 
17 
18

View Code

7.禁止用户输入数字

 1 
 2 
 3 
 4     
 5     Document
 6 
 7 
 8 
 9     Type some text (numbers not allowed):
10     
11 
12 
13 
33 
34

View Code

8.Web SQL浏览器端数据库

View Code

9.一个增删demo

 1 DOCTYPE html>
 2 <html lang="en">
 3 <head>
 4     <meta charset="UTF-8">
 5     <title>一个增删demotitle>
 6 head>
 7 <body>
 8     <input type="text" id="text">
 9     <input type="button" value="添加" id="button">
10     <ul>
11         <li>第1个<button class="btn" id="1">删除button>li>
12         <li>第2个<button class="btn" id="2">删除button>li>
13         <li>第3个<button class="btn" id="3">删除button>li>
14     ul>
15     <script>
16             var button = document.getElementById("button");
17             var text = document.getElementById("text");
18             var ul = document.getElementsByTagName("ul")[0];
19             var btnClass = document.getElementsByClassName("btn");        
20         button.onclick = function(){
21             var deleteButton = document.createElement("button");    
22             var value = text.value;
23                 deleteButton.setAttribute("class","btn");
24             var deleteText = document.createTextNode("删除");
25                 deleteButton.appendChild(deleteText);
26             var li = document.createElement("li");
27             var liText = document.createTextNode(value);
28                 li.appendChild(liText);
29                 li.appendChild(deleteButton);
30                 ul.appendChild(li);
31             for(var i=0;i<btnClass.length;i++){
32                 btnClass[i].onclick=function(){
33                 this.parentNode.parentNode.removeChild(this.parentNode);
34             }
35         }
36         }
37 
38             for(var i=0;i<btnClass.length;i++){
39                 btnClass[i].onclick=function(){
40                     this.parentNode.parentNode.removeChild(this.parentNode);
41                 }
42             }
43     script>
44 body>
45 html>

View Code

10.Generator抽奖逻辑

View Code

11.检测数据类型

//写出一个比typeof运算符更准确的类型判断函数。

var type = function (o){
  var s = Object.prototype.toString.call(o);
  return s.match(/\[object (.*?)\]/)[1].toLowerCase();
};

type({}); // "object"
type([]); // "array"
type(5); // "number"
type(null); // "null"
type(); // "undefined"
type(/abcd/); // "regex"
type(new Date()); // "date"

View Code

    function checkedType(target){
        return Object.prototype.toString.call(target).slice(8,-1);
    }

View Code

12.数组去重——Array.filter()

let arr=[2,3,4,2,3];
console.log(arr.filter(function(item,index,self){
    return self.indexOf(item)==index}
    )
)

View Code

注:性能差

13.数组/字符串去重——利用for循环去重

/*var arr1 ="abcdabcd";*/
var arr1=['a','b','c','a','d','b']
var arr2=[];
for(var i=0;i){
    if(arr2.indexOf(arr1[i])<0){
　　　　　　arr2.push(arr1[i]);
       }
 }
document.write(arr2);

View Code

注:性能良好

13.1数组去重——ES6（Set）

let arr=[1,2,3,4,5,3,5,6,2];
let a=new Set(arr);
let b=[...a];
console.log(b);//[1,2,3,4,5,6]

View Code

注:性能优

13.2数组去重——创建空对象

 1 let arr=[1,2,3,4,5,3,5,6,2];
 2 let b=[];
 3 let c={};
 4 for(let i=0;i){
 5    if(!c[arr[i]]){
 6        b.push(arr[i]);
 7        c[arr[i]]='hello';   //
 8    }
 9 }
10 console.log(b);//[ 1, 2, 3, 4, 5, 6 ]
11 console.log(c);
12 /*{1: "hello", 2: "hello", 3: "hello", 4: "hello", 5: "hello", 6: "hello"}*/

View Code

注:性能最优

13.3数组去重——利用splice

function newArr(arr){
    for(var i=0;i){
        for(var j=i+1;j)
            if(arr[i]==arr[j]){ 
            //如果第一个等于第二个，splice方法删除第二个
            arr.splice(j,1);
            j--;
            }
        }
 
    return arr;
 }
var arr = [1,1,2,5,6,3,5,5,6,8,9,8];
 
console.log(newArr(arr))

View Code

注：性能最差

13.4数组去重——Array.sort()

function distinct(a, b) {
    let arr = a.concat(b)
    arr = arr.sort()
    let result = [arr[0]]

    for (let i=1, len=arr.length; i) {
        arr[i] !== arr[i-1] && result.push(arr[i])
    }
    return result;
}
console.log(distinct([4,3,2],[5,4,2])) //[2,3,4,5]

View Code

13.5字符串去重——ES6(set)

[...new Set('ababbc')].join('')
// "abc"

View Code

14.1判断数组是否存在重复值

var arr=['333','222','222','444','333'];
var s=arr.join(",")+",";
for(var i=0;i){
     if(s.replace(arr[i]+",","").indexOf(arr[i]+",")>0)
           alert("数组中有重复元素：" + arr[i]);
}

View Code

14.2判断数组是否存在重复值（2）

var ary = new Array("111","22","33","111");
var nary=ary.sort();

for(var i=0;i){
       if (nary[i]==nary[i+1]){
             alert("数组重复内容："+nary[i]);
       }
}

View Code

14.3判断数组是否存在重复值（3）

function isRepeat(arr){
    var hash = [];
    for(var i in arr) {
         if(hash[arr[i]])
            return true;
         hash[arr[i]] = true;
}
     return false;
}

var arr=["111","22","33","111"];
alert(isRepeat(arr))

View Code

15.获取浏览URL中查询字符串的参数

 1 function showWindowHref(arr){
 2     var sHref = arr;
 3     var args = sHref.split('?');
 4     if(args[0] == sHref){
 5         return "";
 6     }
 7     var arr = args[1].split('&');
 8     alert(arr)    //staffid=12333,name=xiaoming,age=23
 9     var obj = {};
10     for(var i = 0;i< arr.length;i++){
11         var arg = arr[i].split('=');
12         obj[arg[0]] = arg[1];
13         console.log(obj[arg[0]])    //12333,xiaomi,23
14     }
15     return obj;
16 }
17 var href = showWindowHref("https://www.runoob.com/jsref/met-win-close.html?staffid=12333&name=xiaoming&age=23"); // obj
18 alert(href['name']); // xiaoming

View Code

16.原生Ajax

 1 
 2 
 3 
 4     
 5     原生的Ajax
 6 
 7 
 8 
 9 
37 
38

View Code

 1 100——客户必须继续发出请求
 2 101——客户要求服务器根据请求转换HTTP协议版本
 3 200——交易成功
 4 201——提示知道新文件的URL
 5 202——接受和处理、但处理未完成
 6 203——返回信息不确定或不完整
 7 204——请求收到，但返回信息为空
 8 205——服务器完成了请求，用户代理必须复位当前已经浏览过的文件
 9 206——服务器已经完成了部分用户的GET请求
10 300——请求的资源可在多处得到
11 301——删除请求数据
12 302——在其他地址发现了请求数据
13 303——建议客户访问其他URL或访问方式
14 304——客户端已经执行了GET，但文件未变化
15 305——请求的资源必须从服务器指定的地址得到
16 306——前一版本HTTP中使用的代码，现行版本中不再使用
17 307——申明请求的资源临时性删除
18 400——错误请求，如语法错误
19 401——请求授权失败
20 402——保留有效ChargeTo头响应
21 403——请求不允许
22 404——没有发现文件、查询或URl
23 405——用户在Request-Line字段定义的方法不允许
24 406——根据用户发送的Accept拖，请求资源不可访问
25 407——类似401，用户必须首先在代理服务器上得到授权
26 408——客户端没有在用户指定的时间内完成请求
27 409——对当前资源状态，请求不能完成
28 410——服务器上不再有此资源且无进一步的参考地址
29 411——服务器拒绝用户定义的Content-Length属性请求
30 412——一个或多个请求头字段在当前请求中错误
31 413——请求的资源大于服务器允许的大小
32 414——请求的资源URL长于服务器允许的长度
33 415——请求资源不支持请求项目格式
34 416——请求中包含Range请求头字段，在当前请求资源范围内没有range指示值，请求也不包含If-Range请求头字段
35 417——服务器不满足请求Expect头字段指定的期望值，如果是代理服务器，可能是下一级服务器不能满足请求
36 500——服务器产生内部错误
37 501——服务器不支持请求的函数
38 502——服务器暂时不可用，有时是为了防止发生系统过载
39 503——服务器过载或暂停维修
40 504——关口过载，服务器使用另一个关口或服务来响应用户，等待时间设定值较长
41 505——服务器不支持或拒绝支请求头中指定的HTTP版本

View Code

17.短横线转换为驼峰命名

View Code

18.vue实现简单购物车



    
        
        vue综合练习
        
    
    
        
            购物车
            if="products.length==0">空空如也
            else>
                for="(product,index) in products">
                        
                    
                        编号
                        商品名称
                        商品价格
                        商品数量
                        操作
                    
                    {{index+1}}
                        {{product.name}}
                        {{product.price}}
                        {{product.num}}
                        
                    
                        总价：{{total}}

编号	商品名称	商品价格	商品数量	操作
{{index+1}}	{{product.name}}	{{product.price}}	{{product.num}}
总价：{{total}}

View Code

18.2.vue实现简单购物车2




    
    Document
    


        
             购物车

View Code

19.vue——卡片列表循环单击选中效果

<li v-for="(item,index) in filterAddress"  v-bind:class="{'check': index == currentIndex}" @click="currentIndex=index"> 
 /*filterAddress计算属性的方法值可以放在，充当数组*/
//@click="currentIndex=index"标明了将点击的索引值赋给currentIndex，index == currentIndex自身的索引和当前点击事件索引相同，则产生选中事件
/*当产生点击事件后，第一个currentIndex因为相等所以产生true，check类就可以渲染，v:bind和@click结合使用，会产生奇妙的状态！*/

View Code

for="(item,index) in filterAddress"  v-bind:class="{'check': index == current && current !== ' '}" @click="current=index"> 
 /*current默认为空,然后默认不会被选中*/

View Code

注:与1的手风琴效果类似

20.深度拷贝

var deepCopy = function(obj) {
    if (typeof obj !== 'object') return;
    var newObj = obj instanceof Array ? [] : {};
    for (var key in obj) {
        if (obj.hasOwnProperty(key)) {
            newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
        }
    }
    return newObj;
}

View Code

21.ES6——Primise-async语法实现红绿灯




    
    
    
    实现一个红绿灯
    


    
        实现一个红绿灯，把一个圆形 div 按照绿色 3 秒，黄色 1 秒，红色 2 秒循环改变背景色
        Promise、async\await 语法实现

View Code

22.HTML5拖拽图片上传及本地预览




    
    
    
    HTML5拖拽上传
    


    HTML5拖拽上传及本地预览
    
        
            将文件拖拽到此处开始上传！
            for="inputFile" class="button">选择文件

View Code

23.使用js实现极简Vue.js双向数据绑定功能




    
    
    
    实现极简Vue.js双向数据绑定




    
    {{message}}

View Code

<--! HTML代码-->

    
        input1=>
    
    
        input2=>
        
    
    
        我每次比input1的值加1=>
        
    


<--! JS代码-->

var oInput1 = document.getElementById('input1');
var oInput2 = document.getElementById('input2');
var oSpan = document.getElementById('span');
var obj = {};
Object.defineProperties(obj, {
    val1: {
        configurable: true,
        get: function() {
            oInput1.value = 0;
            oInput2.value = 0;
            oSpan.innerHTML = 0;
            return 0
        },
        set: function(newValue) {
            oInput2.value = newValue;
            oSpan.innerHTML = Number(newValue) ? Number(newValue) : 0
        }
    },
    val2: {
        configurable: true,
        get: function() {
            oInput1.value = 0;
            oInput2.value = 0;
            oSpan.innerHTML = 0;
            return 0
        },
        set: function(newValue) {
            oInput1.value = newValue;
            oSpan.innerHTML = Number(newValue)+1;
        }
    }
})
oInput1.value = obj.val1;
oInput1.addEventListener('keyup', function() {
    obj.val1 = oInput1.value;
}, false)
oInput2.addEventListener('keyup', function() {
    obj.val2 = oInput2.value;
}, false)

View Code

24.左中右三栏布局，中间自适应，5种布局方法

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>左中右三栏布局，中间自适应，5种布局方法title>
    <style>
        body{
            margin: 0;
            padding: 0;
        } 
        /**  FlexBox  **/
        .container{display: flex;}
        .container div{min-height: 100px;}
        .container .left,
        .container .right{width: 300px; background-color: orange;}
        .container .center{flex:1;background-color: #ccc;}

        /**  Float  **/
        .container2 div{min-height: 100px;}
        .container2 .left,
        .container2 .right{background-color: palegreen;width: 300px;}
        .container2 .center{background-color: #ccc}
        .container2 .left{float: left;}
        .container2 .right{float: right;}

        /**  absolute  **/
        .container3{min-height: 100px;}
        .container3 div{min-height: 100px;position: absolute;}
        .container3 .left,
        .container3 .right{background-color: palegreen;width: 300px;}
        .container3 .center{background-color: #ccc;left: 300px;right: 300px;}
        .container3 .left{left: 0;}
        .container3 .right{right: 0;}

        /**  table  **/
        .container4{width: 100%;height: 100px;display: table;}
        .container4 div{display: table-cell;}
        .container4 .left,
        .container4 .right{background-color: palegreen;width: 300px;}
        .container4 .center{background-color: #ccc;}

        /**  CSS Grid  **/
        .container5{
            width: 100%;
            display: grid;
            grid-template-rows: 100px;
            grid-template-columns: 300px auto 300px;
        }
        .container5 div{min-height: 100px;}
        .container5 .left,
        .container5 .right{background-color: palegreen;}
        .container5 .center{background-color: #ccc;}

        /**  双飞翼（浮动）  **/
        .container6{
            
        }
        .container6 div{min-height: 100px;}
        .container6 .left,
        .container6 .right{background-color: palegreen;}
        .container6 .center{background-color: #ccc;}
    style>
head>
<body>
    
    
    <h1>左中右三栏布局，中间自适应h1>
    <h2>1. FlexBox方案h2>
    <div class="container">
        <div class="left">div>
        <div class="center">
            左中右三栏布局，中间自适应，FlexBox方案左中右三栏布局，中间自适应，FlexBox方案左中右三栏布局，
            中间自适应，FlexBox方案左中右三栏布局，中间自适应，FlexBox方案左中右三栏布局，中间自适应，FlexBox方案
        div>
        <div class="right">div>
    div>

    <h2>2. Float方案h2>
    <div class="container2">
        <div class="left">div>
        <div class="right">div>
        <div class="center">
            左中右三栏布局，中间自适应，Float方案左中右三栏布局，中间自适应，Float方案左中右三栏布局，中间自适应，
            Float方案左中右三栏布局，中间自适应，Float方案左中右三栏布局，中间自适应，Float方案左中右三栏布局，中间自适应
        div>
    div>

    <h2>3. 绝对定位方案h2>
    <div class="container3">
        <div class="left">div>
        <div class="center">
            左中右三栏布局，中间自适应，绝对定位方案左中右三栏布局，中间自适应，绝对定位方案左中右三栏布局，
            中间自适应，绝对定位方案左中右三栏布局，中间自适应，绝对定位方案左中右三栏布局，中间自适应，绝对定位方案
        div>
        <div class="right">div>
    div>

    <h2>4. 格布局方案h2>
    <div class="container4">
        <div class="left">div>
        <div class="center">
            左中右三栏布局，中间自适应，表格布局方左中右三栏布局，中间自适应，表格布局方左中右三栏布局，中间自适应
            左中右三栏布局，中间自适应，表格布局方左中右三栏布局，中间自适应，表格布局方左中右三栏布局，中间自适应，
        div>
        <div class="right">div>
    div>

    <h2>5. 网格布局方案h2>
    <div class="container5">
        <div class="left">div>
        <div class="center">
            左中右三栏布局，中间自适应，网格布局方案左中右三栏布局，中间自适应，网格布局方案左中右三栏布局，中间自适应，网格布局方案
            左中右三栏布局，中间自适应，网格布局方案左中右三栏布局，中间自适应，网格布局方案左中右三栏布局，中间自适应，网格布局方案
        div>
        <div class="right">div>
    div>

    <h2>6. 双飞翼（浮动）布局方案h2>
    <div class="container6">
        <div class="main">
            <div class="center">
            双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案
            双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案双飞翼（浮动）布局方案
        div>
        div>
        <div class="left">div>
        <div class="right">div>
    div>
body>
html>

View Code

25.DIV模板引擎

DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>DIV模板引擎title>
head>

<body>
    <h1>DIV模板引擎h1>
    <script>
        var Template = function (tempstr, data) {
            var re = /<%([^%>]+)?%>/g,
                cursor = 0, // 字符串的查找位置
                reExp = /^\s*(for|if|else|switch|case|break|continue|{|})(.*)?/g,
                code = 'var arr = [];\n';   
            var add = function (line, flag) { //flag --> 判断是否是JS代码
                // 第一次：line ==> 我的名字是：
                code += flag ? line.match(reExp) ? line : 'arr.push(' + line + ');\n'
                    : 'arr.push("' + line.replace(/"/, '\\"') + '");\n';
            }
            while (item = re.exec(tempstr)) {
                add(tempstr.slice(cursor, item.index));
                add(item[1], true);
                cursor = item.index + item[0].length;
            }
            add(tempstr.substring(cursor));
            code += 'return arr.join("");';
            return new Function(code.replace(/[\r\n\t]/g, '')).apply(data);
        }
        
        // var str = '我的名字是：<%this.name%>，年龄是：<%this.profile.age%>，Over！！！';
        // var res = Template(str, {
        //   name: 'Dunizb',
        //   profile: {
        //     age: 22
        //   }
        // });
        // console.log(res);
        
        var str = '我的爱好：<%for(var i in this.hobby){%>'
            + '<%this.hobby[i]%>'
            + '<%}%>';
        var res = Template(str, {
            hobby: ['php', 'java', 'javascript', 'linux', 'python']
        });
        document.write(res);
    script>
body>

html>

View Code

26.省市两级级联下拉列表

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>省市两级级联下拉列表title>
head>
<body>
    <select id="province">
        <option>==请选择省份==option>
    select>
    <select id="city">
        <option>==请选择城市==option>
    select>
body>
<script>
    // 准备数据
    var data = [
        {"code" : "0001", "name" : "广东省",
            "cities" : [
                {"code" : "00010001", "name" : "广州市"},
                {"code" : "00010002", "name" : "深圳市"},
                {"code" : "00010003", "name" : "东莞市"}
            ]
        },
        {"code" : "0002", "name" : "湖南省",
            "cities" : [
                {"code" : "00020001", "name" : "长沙市"},
                {"code" : "00020002", "name" : "衡阳市"},
                {"code" : "00020003", "name" : "郴州市"}
            ]
        },
        {"code" : "0003", "name" : "江西省",
            "cities" : [
                {"code" : "00030001", "name" : "南昌市"},
                {"code" : "00030002", "name" : "赣州市"},
                {"code" : "00030003", "name" : "吉安市"}
            ]
        }
    ];

    window.onload = function(){
        // 获取省份城市select
        var proSelect = document.getElementById("province");
        for (var i = 0; i < data.length; i++){
            var json = data[i];
            var option = new Option(json.name, json.code, false, false);
            proSelect.add(option);
        }
        // 为proSelect绑定onChange事件
        proSelect.onchange = function(){
            var citySelect = document.getElementById("city");
            // 在下次选择省份之前先清空城市下拉列表
            for (var i = citySelect.length - 1; i > 0; i--){
                citySelect.remove(i);
            }
            for (var i = 0; i < data.length; i++){
                var json = data[i];
                if (json.code == this.value){
                    // 取城市
                    var cities = json.cities;
                    for (var j = 0; j < cities.length; j++){
                        // 获取其中的json
                        var temp = cities[j];
                        var option = new Option(temp.name, temp.code, false, false);
                        citySelect.add(option);
                    }
                }   
            }
        }
    }
script>
html>

View Code

27.CSS3——打字延迟动画

DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>打字动画title>
    <style>
        body {background-color: #000;color:green;}
        p {
            width: 27em;      /*这里控制打字的宽度和子长,也可以取消下面的JS注释 */
            font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
            overflow: hidden;
            white-space: nowrap;
            border-right: .05em solid transparent;/*兼容处理*/
            border-right: .05em solid;
            animation: typing 6s steps(16),   
                       caret 1s steps(1) infinite;
        }
        @keyframes typing {
            from { width: 0; }
        }
        @keyframes caret {
            50% { border-right-color: transparent; }
        }
    style>
head>
<body>
<p>Javascript是世界最好的语言,hello world,hello lucas！p>
    <script>
        /*** 此段JS代码的目的是为了动态设置文字的宽度和步长 ****/

       // var ps = document.getElementsByTagName("p");
       // for(var i=0 ;i
       //     var len = ps[i].textContent.length;
       //     ps[i].style.width = len + 'em';
       //     ps[i].style.animationTimingFunction = "steps("+len+"),steps(1)";
       // }
    script>
body>
html>

View Code

28.CSS3——文字闪烁动画

DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>文字闪烁title>
    <style>
        .hightlight {
            width: 500px;
            margin: 100px auto;
            font:700 20px/20px "Microsoft YaHei";
            animation: 1s blink 3 steps(1) ;
        }
        @keyframes blink {
            50% { color: transparent; }
        }
    style>
head>
<body>
<div class="hightlight">hello lucasdiv>
body>
html>

View Code

29.数组与字符串对象相同的方法

concat()
indexOf()
lastIndexOf()
includes()
toString()
slice()

View Code

30.找出数组最大个数

//es5写法
function maxNumber(){
    var arr = [10,29,5]
    document.write(Math.max.apply(null,arr))
}

View Code

//es6拓展运算符...

Math.max(...arr)

View Code

arr.sort((num1, num2) => {
    return num1 - num2 < 0
})
arr[0]

View Code

let max = arr[0];
for (let i = 0; i < arr.length - 1; i++) {
    max = max < arr[i+1] ? arr[i+1] : max
}

View Code

31.JS简单数组排序

function sortNumber(a,b)
{
    return a - b;  //如果需要降序排序可以把a与b调换即可
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "
")
document.write(arr.sort(sortNumber))

View Code

    var arr = [1, 7, 10, 4, 6];
    function compare(val1, val2) {
      if(val1 < val2) {
        return -1;
      } else if(val1 > val2) {
        return 1;
      } else {
        return 0;
      }
    };
    arr.sort(compare);
    console.log(arr);

View Code

32.对数组进行随机排序

var points = [40, 100, 1, 5, 25, 10];
document.getElementById("demo").innerHTML = points;  

function myFunction() {
  points.sort(function(a, b){return 0.5 - Math.random()});
  document.getElementById("demo").innerHTML = points;
}

View Code

33.为不具备 Iterator 接口的对象提供遍历方法

function* objectEntries(obj) {
    const propKeys = Reflect.ownKeys(obj);
    for (const propKey of propKeys) {
        yield [propKey, obj[propKey]];
    }
}
 
const jane = { first: 'Jane', last: 'Doe' };
for (const [key,value] of objectEntries(jane)) {
    console.log(`${key}: ${value}`);
}
// first: Jane
// last: Doe

//Reflect.ownKeys() 返回对象所有的属性，不管属性是否可枚举，包括 Symbol。

View Code

34.嵌套数组的平铺

function* iterTree(tree) {
  if (Array.isArray(tree)) {
    for(let i=0; i < tree.length; i++) {
      yield* iterTree(tree[i]);
    }
  } else {
    yield tree;
  }
}

const tree = [ 'a', ['b', 'c'], ['d', 'e'] ];

for(let x of iterTree(tree)) {
  console.log(x);
}
// a
// b
// c
// d
// e

//由于扩展运算符...默认调用 Iterator 接口，所以上面这个函数也可以用于嵌套数组的平铺。

`[...iterTree(tree)] // ["a", "b", "c", "d", "e"]`

View Code

35.Markdown源码

  1 
  2 
  3 
  4 
  5     
  6     md转换为html
  7     
  8 
  9 
 10 
 11     Markdown转换为HTML的Demo
 12     
209     
243     
251     
252         253254255258259
             
                 
                 
256                     
257                 
             
         
260     
261 
262 
263

View Code

待续......

你可能感兴趣的:(常用的js代码片段)

OC语言多界面传值五大方式 Magnetic_h ios ui 学习 objective-c 开发语言
前言在完成暑假仿写项目时，遇到了许多需要用到多界面传值的地方，这篇博客来总结一下比较常用的五种多界面传值的方式。属性传值属性传值一般用前一个界面向后一个界面传值，简单地说就是通过访问后一个视图控制器的属性来为它赋值，通过这个属性来做到从前一个界面向后一个界面传值。首先在后一个界面中定义属性@interfaceBViewController:UIViewController@propertyNSSt
element实现动态路由+面包屑软件技术NINI vue案例 vue.js 前端
el-breadcrumb是ElementUI组件库中的一个面包屑导航组件，它用于显示当前页面的路径，帮助用户快速理解和导航到应用的各个部分。在Vue.js项目中，如果你已经安装了ElementUI，就可以很方便地使用el-breadcrumb组件。以下是一个基本的使用示例：安装ElementUI（如果你还没有安装的话）:你可以通过npm或yarn来安装ElementUI。bash复制代码npmi
Python数据分析与可视化实战指南 William数据分析 python python 数据
在数据驱动的时代，Python因其简洁的语法、强大的库生态系统以及活跃的社区，成为了数据分析与可视化的首选语言。本文将通过一个详细的案例，带领大家学习如何使用Python进行数据分析，并通过可视化来直观呈现分析结果。一、环境准备1.1安装必要库在开始数据分析和可视化之前，我们需要安装一些常用的库。主要包括pandas、numpy、matplotlib和seaborn等。这些库分别用于数据处理、数学
C#中使用split分割字符串互联网打工人no1 c#
1、用字符串分隔：usingSystem.Text.RegularExpressions;stringstr="aaajsbbbjsccc";string[]sArray=Regex.Split(str,"js",RegexOptions.IgnoreCase);foreach(stringiinsArray)Response.Write(i.ToString()+"");输出结果：aaabbbc
【华为OD机试真题2023B卷 JAVA&JS】We Are A Team 若博豆 java 算法华为 javascript
华为OD2023（B卷）机试题库全覆盖，刷题指南点这里WeAreATeam时间限制：1秒|内存限制：32768K|语言限制：不限题目描述：总共有n个人在机房，每个人有一个标号（1<=标号<=n），他们分成了多个团队，需要你根据收到的m条消息判定指定的两个人是否在一个团队中，具体的：1、消息构成为：abc，整数a、b分别代
数组去重好奇的猫猫猫
整理自js中基础数据结构数组去重问题思考？如何去除数组中重复的项例如数组：[1,3,4,3,5]我们在做去重的时候，一开始想到的肯定是，逐个比较，外面一层循环，内层后一个与前一个一比较，如果是久不将当前这一项放进新的数组，挨个比较完之后返回一个新的去过重复的数组不好的实践方式上述方法效率极低，代码量还多，思考？有没有更好的方法这时候不禁一想当然有了！！！hashtable啊，通过对象的hash办法
Day17笔记-高阶函数 ~在杰难逃~ Python 笔记 python 开发语言 pycharm 数据分析
高阶函数【重点掌握】函数的本质：函数是一个变量，函数名是一个变量名，一个函数可以作为另一个函数的参数或返回值使用如果A函数作为B函数的参数，B函数调用完成之后，会得到一个结果，则B函数被称为高阶函数常用的高阶函数：map(),reduce(),filter(),sorted()1.map()map(func,iterable)，返回值是一个iterator【容器，迭代器】func:函数iterab
【JS】执行时长(100分) |思路参考+代码解析（C++） l939035548 JS 算法数据结构 c++
题目为了充分发挥GPU算力，需要尽可能多的将任务交给GPU执行，现在有一个任务数组，数组元素表示在这1秒内新增的任务个数且每秒都有新增任务。假设GPU最多一次执行n个任务，一次执行耗时1秒，在保证GPU不空闲情况下，最少需要多长时间执行完成。题目输入第一个参数为GPU一次最多执行的任务个数，取值范围[1,10000]第二个参数为任务数组长度，取值范围[1,10000]第三个参数为任务数组，数字范围
node.js学习小猿L node.js node.js 学习 vim
node.js学习实操及笔记温故node.js，node.js学习实操过程及笔记~node.js学习视频node.js官网node.js中文网实操笔记githubcsdn笔记为什么学node.js可以让别人访问我们编写的网页为后续的框架学习打下基础，三大框架vuereactangular离不开node.jsnode.js是什么官网：node.js是一个开源的、跨平台的运行JavaScript的运行
docker igotyback eureka 云原生
Docker容器的文件系统是隔离的，但是可以通过挂载卷（Volumes）或绑定挂载（BindMounts）将宿主机的文件系统目录映射到容器内部。要查看Docker容器的映射路径，可以使用以下方法：查看容器配置：使用dockerinspect命令可以查看容器的详细配置信息，包括挂载的卷。例如：bashdockerinspect在输出的JSON格式中，查找"Mounts"部分，这里会列出所有的挂载信息
mac电脑命令行获取电量小米人er 我的博客 macos 命令行
在macOS上，有几个命令行工具可以用来获取电量信息，最常用的是pmset命令。你可以通过以下方式来查看电池状态和电量信息：查看电池状态：pmset-gbatt这个命令会返回类似下面的输出：Nowdrawingfrom'BatteryPower'-InternalBattery-0(id=1234567)95%;discharging;4:02remainingpresent:true输出中包括电
在Ubuntu中编译含有JSON的文件出现报错芝麻糊76 Linux kill_bug linux ubuntu json
在ubuntu中进行JSON相关学习的时候，我发现了一些小问题，决定与大家进行分享，减少踩坑时候出现不必要的时间耗费截取部分含有JSON部分的代码进行展示char*str="{\"title\":\"JSONExample\",\"author\":{\"name\":\"JohnDoe\",\"age\":35,\"isVerified\":true},\"tags\":[\"json\",\"
Xinference如何注册自定义模型玩人工智能的辣条哥人工智能 AI 大模型 Xinference
环境：Xinference问题描述：Xinference如何注册自定义模型解决方案：1.写个model_config.json，内容如下{"version":1,"context_length":2048,"model_name":"custom-llama-3","model_lang":["en","ch"],"model_ability":["generate","chat"],"model
Python开发常用的三方模块如下：换个网名有点难 python 开发语言
Python是一门功能强大的编程语言，拥有丰富的第三方库，这些库为开发者提供了极大的便利。以下是100个常用的Python库，涵盖了多个领域：1、NumPy，用于科学计算的基础库。2、Pandas，提供数据结构和数据分析工具。3、Matplotlib，一个绘图库。4、Scikit-learn，机器学习库。5、SciPy，用于数学、科学和工程的库。6、TensorFlow，由Google开发的开源机
Shell、Bash、Zsh这都是啥啊小白码上飞 bash linux 开发语言
Zsh和Bash都是我们常用的Shell，那先搞明白啥是shell吧。Shell作为一个单词，他是“壳”的意思，蛋壳坚果壳。之所以叫壳，是为了和计算机的“核”来区分，用它表示“为使用者提供的操作界面”。所以这个命名其实很形象，翻译成中文，直译过来叫“壳层”。个人认为这个叫法很奇怪，意译貌似也没有什么好的词汇来匹配。就还是叫shell吧。维基百科给的定义是：Incomputing,ashellisa
一文掌握python常用的list（列表）操作程序员neil python python 开发语言
目录一、创建列表1.直接创建列表：2.使用list()构造器3.使用列表推导式4.创建空列表二、访问列表元素1.列表支持通过索引访问元素，索引从0开始：2.还可以使用切片操作访问列表的一部分：三、修改列表元素四、添加元素1.append()：在末尾添加元素2.insert()：在指定位置插入元素五、删除元素1.del：删除指定位置的元素2.remove()：删除指定值的第一个匹配项3.pop()：
发现荞麦过敏这件事怪小泊
荞麦在我这里不是常用的谷物。所以前二十年，我以为自己是很正常的，从街头小吃到包装零食到每日三餐，从来没有不能吃的。可是有天我突然病倒了，喉咙火辣辣的肿痛，口水都咽不下去，舌头发麻。当时我以为吃太多零食所致，因为那天我吃了很辣的泡椒凤爪。其实我是不怎么吃辣的。而那个泡椒凤爪真的超辣。当时我以为自己吃多了，并不知道自己对哪个食物过敏。因为不舒服我早早睡了，结果并没有睡着。肚子一阵一阵疼，非常痛苦，终于
语文主题教学学习笔记之87 东哥杂谈
“语文主题教学”学习笔记之八十七（0125）今天继续学习小学语文主题教学的实践样态。板块三：教学中体现“书艺”味道。作为四大名著之一的《水浒传》，堪称我国文学宝库之经典。对从《水浒传》中摘选的单元，教师就要了解其原生态，即评书体特点。这也要求教师要了解一些常用的评书行话术语，然后在教学时适时地加入一些，让学生体味其文本中原有的特色。学生也要尽可能地通过朗读的方式，而不单是分析讲解的方式进行学习。细
Python神器！WEB自动化测试集成工具 DrissionPage 亚丁号 python 开发语言
一、前言用requests做数据采集面对要登录的网站时，要分析数据包、JS源码，构造复杂的请求，往往还要应付验证码、JS混淆、签名参数等反爬手段，门槛较高。若数据是由JS计算生成的，还须重现计算过程，体验不好，开发效率不高。使用浏览器，可以很大程度上绕过这些坑，但浏览器运行效率不高。因此，这个库设计初衷，是将它们合而为一，能够在不同须要时切换相应模式，并提供一种人性化的使用方法，提高开发和运行效率
Linux查看服务器日志 TPBoreas 运维 linux 运维
一、tail这个是我最常用的一种查看方式用法如下：tail-n10test.log查询日志尾部最后10行的日志;tail-n+10test.log查询10行之后的所有日志;tail-fn10test.log循环实时查看最后1000行记录(最常用的)一般还会配合着grep用，(实时抓包)例如:tail-fn1000test.log|grep'关键字'（动态抓包）tail-fn1000test.log
Mongodb Error: queryTxt ETIMEOUT xxxx.wwwdz.mongodb.net 佛一脚 error react mongodb 数据库
背景每天都能遇到奇怪的问题，做个记录，以便有缘人能得到帮助！换了一台电脑开发nextjs程序。需要连接mongodb数据，对数据进行增删改查。上一台电脑好好的程序，新电脑死活连不上mongodb数据库。同一套代码，没任何修改，搞得我怀疑人生了，打开浏览器进入mongodb官网毫无问题，也能进入线上系统查看数据，网络应该是没问题。于是我尝试了一下手机热点，这次代码能正常跑起来，连接数据库了！！！是不
Vue( ElementUI入门、vue-cli安装) m0_l5z elementui vue.js
一.ElementUI入门目录：1.ElementUI入门1.1ElementUI简介1.2Vue+ElementUI安装1.3开发示例2.搭建nodejs环境2.1nodejs介绍2.2npm是什么2.3nodejs环境搭建2.3.1下载2.3.2解压2.3.3配置环境变量2.3.4配置npm全局模块路径和cache默认安装位置2.3.5修改npm镜像提高下载速度2.3.6验证安装结果3.运行n
入门MySQL——查询语法练习 K_un
前言：前面几篇文章为大家介绍了DML以及DDL语句的使用方法，本篇文章将主要讲述常用的查询语法。其实MySQL官网给出了多个示例数据库供大家实用查询，下面我们以最常用的员工示例数据库为准，详细介绍各自常用的查询语法。1.员工示例数据库导入官方文档员工示例数据库介绍及下载链接：https://dev.mysql.com/doc/employee/en/employees-installation.h
博客网站制作教程 2401_85194651 java maven
首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
00. 这里整理了最全的爬虫框架（Java + Python）有一只柴犬爬虫系列爬虫 java python
目录1、前言2、什么是网络爬虫3、常见的爬虫框架3.1、java框架3.1.1、WebMagic3.1.2、Jsoup3.1.3、HttpClient3.1.4、Crawler4j3.1.5、HtmlUnit3.1.6、Selenium3.2、Python框架3.2.1、Scrapy3.2.2、BeautifulSoup+Requests3.2.3、Selenium3.2.4、PyQuery3.2
vue 创建项目报错：command failed: npm install --loglevel error 那鱼、会飞 vue.js vue-cli3
这个问题其实很好解决，只是很多种情况，逐一排除即可。稳下心来~vuecli3创建项目我的node版本是node14.15.0，（永远不要尝试最新版本）node各种版本下载地址：以往的版本|Node.js(nodejs.org)vue/[email protected]@vue/[email protected]（注意vue/cli2和vue/cli3的下载命名有所改变，2是-形式，3是/形式）其实报错
更改npm镜像源为淘宝镜像骆小骆基于node.js
npm常用指令后缀*最近复习了一下node.js整理了一下跟node.js相关的指令后缀*--save、-S参数意思是把模块的版本信息保存到dependencies（生产环境依赖）中，即你的package.json文件的dependencies字段中；–--save-dev、-D参数意思是把模块版本信息保存到devDependencies（开发环境依赖）中，即你的package.json文件的de
常见的 JVM 调优方法有哪些？爪哇天下 jvm
常见的JVM调优方法有哪些？可以具体到调整哪个参数，调成什么值？对年轻代的EdenSurvivor的比例进行配置-XX:SurvivorRatio=8：表示设置2个Survivor区：1个Eden区的大小比值为2:8，这意味着Survivor区占整个年轻代的1/5，这个参数默认为8如果经常性的SurvivorTo放不下YGC的剩余的对象时候，可以适当的调整比例常用的CMS收集器：设置回收阈值，需要
COCO 格式的数据集转化为 YOLO 格式的数据集 QYQY77 YOLO python
"""--json_path输入的json文件路径--save_path保存的文件夹名字，默认为当前目录下的labels。"""importosimportjsonfromtqdmimporttqdmimportargparseparser=argparse.ArgumentParser()parser.add_argument('--json_path',default='./instances
补充元象二面 Redstone Monstrosity 前端面试
1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重
Java序列化进阶篇 g21121 java序列化
1.transient 类一旦实现了Serializable 接口即被声明为可序列化，然而某些情况下并不是所有的属性都需要序列化，想要人为的去阻止这些属性被序列化，就需要用到transient 关键字。
escape()、encodeURI()、encodeURIComponent()区别详解 aigo JavaScript Web
原文：http://blog.sina.com.cn/s/blog_4586764e0101khi0.html JavaScript中有三个可以对字符串编码的函数，分别是： escape,encodeURI,encodeURIComponent，相应3个解码函数：,decodeURI,decodeURIComponent 。下面简单介绍一下它们的区别 1 escape()函
ArcgisEngine实现对地图的放大、缩小和平移 Cb123456 添加矢量数据对地图的放大、缩小和平移 Engine
ArcgisEngine实现对地图的放大、缩小和平移: 个人觉得是平移，不过网上的都是漫游，通俗的说就是把一个地图对象从一边拉到另一边而已。就看人说话吧. 具体实现: 一、引入命名空间 using ESRI.ArcGIS.Geometry; using ESRI.ArcGIS.Controls; 二、代码实现.
Java集合框架概述天子之骄 Java集合框架概述
集合框架集合框架可以理解为一个容器，该容器主要指映射(map)、集合(set)、数组(array)和列表(list)等抽象数据结构。从本质上来说，Java集合框架的主要组成是用来操作对象的接口。不同接口描述不同的数据类型。简单介绍： Collection接口是最基本的接口，它定义了List和Set，List又定义了LinkLi
旗正4.0页面跳转传值问题何必如此 java jsp
跳转和成功提示 a) 成功字段非空forward 成功字段非空forward，不会弹出成功字段，为jsp转发，页面能超链接传值,传输变量时需要拼接。接拼接方式list.jsp?test="+strweightUnit+"或list.jsp?test="+weightUnit+&qu
全网唯一:移动互联网服务器端开发课程 cocos2d-x小菜 web开发移动开发移动端开发移动互联程序员
移动互联网时代来了！ App市场爆发式增长为Web开发程序员带来新一轮机遇，近两年新增创业者，几乎全部选择了移动互联网项目！传统互联网企业中超过98%的门户网站已经或者正在从单一的网站入口转向PC、手机、Pad、智能电视等多端全平台兼容体系。据统计，AppStore中超过85%的App项目都选择了PHP作为后端程
Log4J通用配置|注意问题笔记 7454103 DAO apache tomcat log4j Web
关于日志的等级那些去百度就知道了！这几天要搭个新框架配置了日志记下来！做个备忘！ #这里定义能显示到的最低级别,若定义到INFO级别,则看不到DEBUG级别的信息了~! log4j.rootLogger=INFO,allLog # DAO层 log记录到dao.log 控制台和总日志文件 log4j.logger.DAO=INFO,dao,C
SQLServer TCP/IP 连接失败问题 ---SQL Server Configuration Manager darkranger sql c windows SQL Server XP
当你安装完之后,连接数据库的时候可能会发现你的TCP/IP 没有启动.. 发现需要启动客户端协议 : TCP/IP 需要打开 SQL Server Configuration Manager... 却发现无法打开 SQL Server Configuration Manager..?? 解决方法: C:\WINDOWS\system32目录搜索framedyn.
[置顶] 做有中国特色的程序员 aijuans 程序员
从出版业说起网络作品排到靠前的，都不会太难看，一般人不爱看某部作品也是因为不喜欢这个类型，而此人也不会全不喜欢这些网络作品。究其原因，是因为网络作品都是让人先白看的，看的好了才出了头。而纸质作品就不一定了，排行榜靠前的，有好作品，也有垃圾。许多大牛都是写了博客，后来出了书。这些书也都不次，可能有人让为不好，是因为技术书不像小说，小说在读故事，技术书是在学知识或温习知识，有些技术书读得可
document.domain 跨域问题 avords document
document.domain用来得到当前网页的域名。比如在地址栏里输入：javascript:alert(document.domain); //www.315ta.com我们也可以给document.domain属性赋值，不过是有限制的，你只能赋成当前的域名或者基础域名。比如：javascript:alert(document.domain = "315ta.com");
关于管理软件的一些思考 houxinyou 管理
工作好多看年了,一直在做管理软件,不知道是我最开始做的时候产生了一些惯性的思维,还是现在接触的管理软件水平有所下降.换过好多年公司,越来越感觉现在的管理软件做的越来越乱. 在我看来,管理软件不论是以前的结构化编程,还是现在的面向对象编程,不管是CS模式,还是BS模式.模块的划分是很重要的.当然,模块的划分有很多种方式.我只是以我自己的划分方式来说一下. 做为管理软件,就像现在讲究MVC这
NoSQL数据库之Redis数据库管理(String类型和hash类型) bijian1013 redis 数据库 NoSQL
一.Redis的数据类型 1.String类型及操作 String是最简单的类型，一个key对应一个value，string类型是二进制安全的。Redis的string可以包含任何数据，比如jpg图片或者序列化的对象。 Set方法：设置key对应的值为string类型的value
Tomcat 一些技巧征客丶 java tomcat dos
以下操作都是在windows 环境下一、Tomcat 启动时配置 JAVA_HOME 在 tomcat 安装目录，bin 文件夹下的 catalina.bat 或 setclasspath.bat 中添加 set JAVA_HOME=JAVA 安装目录 set JRE_HOME=JAVA 安装目录/jre 即可；二、查看Tomcat 版本在 tomcat 安装目
【Spark七十二】Spark的日志配置 bit1129 spark
在测试Spark Streaming时，大量的日志显示到控制台，影响了Spark Streaming程序代码的输出结果的查看(代码中通过println将输出打印到控制台上)，可以通过修改Spark的日志配置的方式，不让Spark Streaming把它的日志显示在console 在Spark的conf目录下，把log4j.properties.template修改为log4j.p
Haskell版冒泡排序 bookjovi 冒泡排序 haskell
面试的时候问的比较多的算法题要么是binary search，要么是冒泡排序，真的不想用写C写冒泡排序了，贴上个Haskell版的，思维简单，代码简单，下次谁要是再要我用C写冒泡排序，直接上个haskell版的，让他自己去理解吧。 sort [] = [] sort [x] = [x] sort (x:x1:xs) | x>x1 = x1:so
java 路径配置文件读取 bro_feng java
这几天做一个项目，关于路径做如下笔记，有需要供参考。取工程内的文件，一般都要用相对路径，这个自然不用多说。在src统计目录建配置文件目录res,在res中放入配置文件。读取文件使用方式： 1. MyTest.class.getResourceAsStream("/res/xx.properties") 2. properties.load(MyTest.
读《研磨设计模式》-代码笔记-简单工厂模式 bylijinnan java 设计模式
声明：本文只为方便我个人查阅和理解，详细的分析以及源代码请移步原作者的博客http://chjavach.iteye.com/ package design.pattern; /* * 个人理解：简单工厂模式就是IOC; * 客户端要用到某一对象，本来是由客户创建的，现在改成由工厂创建，客户直接取就好了 */ interface IProduct {
SVN与JIRA的关联 chenyu19891124 SVN
SVN与JIRA的关联一直都没能装成功，今天凝聚心思花了一天时间整合好了。下面是自己整理的步骤：一、搭建好SVN环境，尤其是要把SVN的服务注册成系统服务二、装好JIRA，自己用是jira-4.3.4破解版三、下载SVN与JIRA的插件并解压，然后拷贝插件包下lib包里的三个jar，放到Atlassian\JIRA 4.3.4\atlassian-jira\WEB-INF\lib下，再
JWFDv0.96 最新设计思路 comsci 数据结构算法工作企业应用公告
随着工作流技术的发展，工作流产品的应用范围也不断的在扩展，开始进入了像金融行业(我已经看到国有四大商业银行的工作流产品招标公告了)，实时生产控制和其它比较重要的工程领域，而
vi 保存复制内容格式粘贴 daizj vi 粘贴复制保存原格式不变形
vi是linux中非常好用的文本编辑工具，功能强大无比，但对于复制带有缩进格式的内容时，粘贴的时候内容错位很严重，不会按照复制时的格式排版，vi能不能在粘贴时，按复制进的格式进行粘贴呢？答案是肯定的，vi有一个很强大的命令可以实现此功能。在命令模式输入:set paste，则进入paste模式，这样再进行粘贴时
shell脚本运行时报错误：/bin/bash^M: bad interpreter 的解决办法 dongwei_6688 shell脚本
出现原因：windows上写的脚本，直接拷贝到linux系统上运行由于格式不兼容导致解决办法： 1. 比如文件名为myshell.sh，vim myshell.sh 2. 执行vim中的命令 : set ff?查看文件格式，如果显示fileformat=dos，证明文件格式有问题 3. 执行vim中的命令 :set fileformat=unix 将文件格式改过来就可以了，然后:w
高一上学期难记忆单词 dcj3sjt126com word english
honest 诚实的；正直的 argue 争论 classical 古典的 hammer 锤子 share 分享；共有 sorrow 悲哀；悲痛 adventure 冒险 error 错误；差错 closet 壁橱；储藏室 pronounce 发音；宣告 repeat 重做；重复 majority 大多数；大半 native 本国的，本地的，本国
hibernate查询返回DTO对象，DTO封装了多个pojo对象的属性 frankco POJO hibernate查询 DTO
DTO-数据传输对象；pojo-最纯粹的java对象与数据库中的表一一对应。简单讲：DTO起到业务数据的传递作用，pojo则与持久层数据库打交道。有时候我们需要查询返回DTO对象，因为DTO
Partition List hcx2013 partition
Given a linked list and a value x, partition it such that all nodes less than x come before nodes greater than or equal to x. You should preserve the original relative order of th
Spring MVC测试框架详解——客户端测试 jinnianshilongnian
上一篇《Spring MVC测试框架详解——服务端测试》已经介绍了服务端测试，接下来再看看如果测试Rest客户端，对于客户端测试以前经常使用的方法是启动一个内嵌的jetty/tomcat容器，然后发送真实的请求到相应的控制器；这种方式的缺点就是速度慢；自Spring 3.2开始提供了对RestTemplate的模拟服务器测试方式，也就是说使用RestTemplate测试时无须启动服务器，而是模拟一
关于推荐个人观点 liyonghui160com 推荐系统关于推荐个人观点
回想起来，我也做推荐了3年多了，最近公司做了调整招聘了很多算法工程师，以为需要多么高大上的算法才能搭建起来的，从实践中走过来，我只想说【不是这样的】第一次接触推荐系统是在四年前入职的时候，那时候，机器学习和大数据都是没有的概念，什么大数据处理开源软件根本不存在，我们用多台计算机web程序记录用户行为，用.net的w
不间断旋转的动画 pangyulei 动画
CABasicAnimation* rotationAnimation; rotationAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation.z"]; rotationAnimation.toValue = [NSNumber numberWithFloat: M
自定义annotation sha1064616837 java enum annotation reflect
对象有的属性在页面上可编辑，有的属性在页面只可读，以前都是我们在页面上写死的，时间一久有时候会混乱，此处通过自定义annotation在类属性中定义。越来越发现Java的Annotation真心很强大，可以帮我们省去很多代码，让代码看上去简洁。下面这个例子主要用到了 1.自定义annotation：@interface，以及几个配合着自定义注解使用的几个注解 2.简单的反射 3.枚举
Spring 源码 up2pu spring
1.Spring源代码 https://github.com/SpringSource/spring-framework/branches/3.2.x 注：兼容svn检出 2.运行脚本 import-into-eclipse.bat 注：需要设置JAVA_HOME为jdk 1.7 build.gradle compileJava { sourceCompatibilit
利用word分词来计算文本相似度 yangshangchuan word word分词文本相似度余弦相似度简单共有词
word分词提供了多种文本相似度计算方式：方式一：余弦相似度，通过计算两个向量的夹角余弦值来评估他们的相似度实现类：org.apdplat.word.analysis.CosineTextSimilarity 用法如下： String text1 = "我爱购物"; String text2 = "我爱读书"; String text3 =