JAVA学习-JavaScript

JavaScript

hello,world

<script src="txy.js"></script>
alert('hello,world');

一个弹窗,hello,world

浏览器控制台使用

console.log(变量名) 在浏览器的控制台打印变量

数据类型

number

js不区分小数和整数,Number

123//整数123
123.1//浮点数123.1
1.123e3//科学计数法
-99//负数
NaN//not a number
Infinity//无限大

字符串

'abc'
"abc"

布尔值

true false

逻辑运算

&& 都为真,结果为真

|| 一个为真,结果为真

!  取反

比较运算符

= 赋值
== 等于(类型不一样,值一样,也会判断为true)
=== 绝对等于(值与类型都要一样,才为真)

这是一个JS缺陷,坚持不要使用==比较

须知:

  • NaN===NaN , 这个与所有的数值都不相等,包括自己
  • 只能通过isNaN(NaN)来判断这个数是否是NaN

浮点数问题:

console.log((1/3) === (1-2/3)); 

尽量避免使用浮点数进行运算,存在精度问题

解决方法

Math.abs(1/3-(1-2/3))<0.000001

数组

Java中数组中放类型相同的元素,JS不需要,什么都可以放

var arr = [1,2,3,'hello',null,true]

取数组下标如果越界了,就会报

undefined

对象

对象是大括号,数组是中括号

每个属性之间使用逗号隔开,最后一个不需要添加

alert('hello,world');
var num = 10;
var person = {
    name : 'xiaoyuan',
    age : num
}

严格检查模式

预防JS随意性导致的问题

'use strict'

严格检查模式必须写在JS的第一行

局部变量建议都使用let去定义

数据类型详解

字符串

  1. 正常字符串我们使用单引号或双引号包裹
  2. 注意转义字符 \
\'
\n
\t
\u4e2d
  1. 多行字符串编写
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        'use strict'
        let name = `
        wocao
        niubi
        123
        888
        `
    </script>
</head>
<body>

用piao来实现多行字符串编写,在tab上面,esc下面这个符号

  1. 模板字符串

利用${变量名}来拼接(必须使用piao来包裹)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        'use strict'
        let name = 'tangxiaoyuan';
        let age = 3;
        let msg = `你好,${name}`;//这里必须用piao来包裹才能使用这种拼接
    </script>
</head>
<body>


</body>
</html>

  1. 字符串长度
.length
  1. 字符串的不可变性

不能改变字符串某个索引的值

  1. 大小写转换
toUpperCase()
toLowerCase()

  1. indexOf()

寻找指定字符在字符串中的索引

  1. substring

截取字符串,是前闭后开

数组

.length()

数组长度

.indexOf()

通过元素获得下标索引

注意,字符串的1与数字1是不同的

.slice()

截取Array的一部分,返回一个新数组,类似String的substring

.push() .pop() 尾部

push 压入到尾部
pop  弹出尾部一个元素

.unshift() .shift() 头部

unshift 压入头部
shift   弹出头部的一个元素

.sort()

排序

.reverse()

元素反转

.concat()

拼接 并没有修改数组,只是会返回一个新数组

.join()

打印拼接数组,使用特定字符串连接

多维数组

对象

若干个键值对

JavaScript中所有的键都是字符串,值是任意类型

创建对象

对象的属性放在{}中,每个属性用逗号隔开,最后一个属性不加逗号

使用不存在的对象属性

不会报错,提示 undefined

动态的删减属性

用delete删除对象的属性

delete person.name

动态的添加属性

person.haha = 'haha'

判断属性值是否在这个对象中

xxx in xxx

'age' in person
true

判断一个属性是否是这个对象自身拥有的

.hasOwnProperty()

'toString' in person
true  //继承了父类的方法 in自动搜索了父类方法
person.hasOwnProperty('toString')
false

流程控制

if判断

let num = 3;
        if (num > 10){
            console.log('wula')
        }else if (num < 10){
            console.log('laji')
        }else{console.log(other)}

while循环

        'use strict'
        let num = 2;
        while (num < 50){
            num++;
            console.log(num);
        }

for循环

        'use strict'
        for (let i = 0; i < 50; i++) {
            console.log(i);
        }

forEach循环

遍历数组

        let arr = [1,2,3,44,5,66];
        arr.forEach(function (value){
            console.log(value)
        })

forIn循环

遍历数组

        let arr = [1,2,3,44,5,66];
        for (let arrKey in arr) {
            console.log(arr[arrKey]);

注意,这里arrKey是数组的索引

forOf循环

for of 可以直接打印数组的值

let set = new Set([1,2,3,3,3,3,3,4]);
        for (let number of set) {
            console.log(number);

控制台

Map和Set

Map

通过key获得value

let map = new Map([["tom",90],['jack',88],['txy',100]]);

控制台

map.get('txy')
100

创建一个新的key与value

控制台

map.set('admin',110)
Map(4) {'tom' => 90, 'jack' => 88, 'txy' => 100, 'admin' => 110}

删除一个key与对应的value

控制台

map.delete('tom')
true
map
Map(3) {'jack' => 88, 'txy' => 100, 'admin' => 110}

Set

无序不重复集合 可以去重

let set = new Set([1,2,3,3,3,3,3,4]);

控制台

set
Set(4) {1, 2, 3, 4}

自动去重了

添加一个重复的数据,也会去重

控制台

set.add(1)
Set(4) {1, 2, 3, 4}

添加一个不重复的数据才会成功

控制台

set.add(5)
Set(5) {1, 2, 3, 4, 5}

删除数据

控制台

set.delete(1)
true
set
Set(4) {2, 3, 4, 5}

判断一个是否被包含

控制台

set.has(2)
true

遍历

遍历Map Set 可以使用forOf 也可以使用迭代器iterator

使用forOf

        let map = new Map([["tom",90],['jack',88],['txy',100]]);
        for (let mapElement of map) {
            console.log(mapElement)

函数

定义函数

function abs(x){//自定义一个绝对值函数
    if(x>=0){
        return x;
    }else{return -x}
}

控制台

abs(10)
10
abs(-10)
10

一旦执行到return代表函数结束,返回结果!

如果没有执行return,函数执行完也会返回结果,结果就是undefined

也可以如下定义:

var abs = function(x){
    
}

两种定义方式无本质区别

参数问题

javascript可以传任意个参数,也可以不传参数

假设不存在参数,如何规避?

可以抛出异常,如下:

        function abs(x){
            if (typeof x!=='number'){//利用typeof判断如果x不是一个number
                throw 'Not A Num'
            }
            if(x>=0){ return x;   }
            else{return -x}
        }

补充:arguments

arguments是一个JS免费赠送的关键字

代表传递进来的所有的参数,是一个数组

问题:arguments包含所有的参数,我们有时候想使用多余的参数来操作,需要排除已有的参数。

补充:rest (es6引入)

获取除了已定义的参数之外的所有参数

    function abs(x,...rest){
        if (x>=0){
            console.log(rest)
            return x;
        }else{return -x}
    }

注意:rest只能放在最后面,且必须加...在前面

变量的作用域

var变量具有作用域

  1. 外部函数不能访问内部函数的变量
  2. 内部函数可以直接访问外部函数的变量
  3. 如果内部函数变量与外部函数变量重名,则:
        function a (){
            var a = 1;
            function b(){
                var a = 'a'
                console.log('inner'+a);
            }
            b();
            console.log('outer'+a);
        }

控制台

内部函数变量与外部函数变量重名的情况下,调用内部函数时,它会从内到外寻找需要调用的变量,内部找到就直接使用内部的,而外部函数调用时,它只会寻找它是否拥有这个变量,无法去内部函数寻找,只能去更高层的地方寻找。

一句话,在JS中,函数查找变量从自身函数开始

规范

由于我们所有的全局变量都会绑定在我们的window上,如果不同的js文件,使用了相同的全局变量,就会有冲突,如何能减少冲突?

        //定义一个唯一全局变量
        var tangAPP = {};
        //定义全局变量,绑在tangAPP上
        tangAPP.name = '123';

把自己的代码全部放入自己定义的唯一的空间名字中,降低全局命名冲突的问题

局部作用域 let

问题的诞生:

        for (var i = 0; i < 100; i++) {
            console.log(i);
        }
        console.log(i+1);

这个i除了for这个作用域,还有作用???

所以ES6推出了let,只要把var改成let就没有这个问题了。

建议都使用let关键字去定义局部作用域的变量!!!

常量 const

被const关键词修饰后就不能随意更改值了

方法

定义方法

方法就是把函数放在对象的里面,对象只有两个东西:属性和方法。

        var tang = {
            name: 'txy',
            birth: 1999,
            age: function (){
                var date = new Date().getFullYear();
                return date-this.birth;
            }
        }

控制台

tang.age()
23

注意,这个this始终指向调用它的对象

apply

在js中可以控制this的指向

        function getAge() {
            var date = new Date().getFullYear();
            return date-this.birth;
        }
        var tang = {
            name: 'txy',
            birth: 1999,
            age: getAge //这里直接写方法名就行

        }
        let age = getAge.apply(tang,[]);//需要指向的对象,以及对象需要传递的参数,这里没有参数传递,即空参
        console.log(age)

这里需要注意下,方法的调用需要加括号,但是apply属于函数的属性,所以不加括号。

内部对象

Date

基本使用

        var date = new Date;
        date.getFullYear();//年
        date.getMonth();//月 0-11月
        date.getDate();//日
        date.getDay();//星期几
        date.getHours();//时
        date.getMinutes();//分
        date.getSeconds();//秒
        date.getTime();//时间戳

时间戳

时间戳是全世界统一的,从1970-1-1 00:00:00 到现在的毫秒数

JSON

json字符串和js对象的转化

        var person = {
            name: 'txy',
            age: 3,
            hobit:'run'
        }
        //将对象转换为json字符串
        var jsonPerson = JSON.stringify(person);

控制台

jsonPerson
'{"name":"txy","age":3,"hobit":"run"}'

将json字符串转换为对象

var obj = JSON.parse(jsonPerson);

面向对象编程

原型

通过指向原型来得到原型的方法和属性

__proto__
        var Student = {
            name: 'txy',
            age: 22,
            doing:function (){
                console.log(this.name+' runing.....')
            }
        }
        var XiaoMing = {
            name:'xiaoming'
        }
        XiaoMing.__proto__=Student;

class 继承

定义一个class类 属性 方法

    class Student {
        constructor(name) {
            this.name = name;
        }
        run(){
            alert('running...')
        }

    }
    var xiaoming = new Student('xiaoming');

继承类

    class Student{
        constructor(name) {
            this.name = name;
        }
        run(){
            alert(this.name+' is running')
        }
    }
    class LittleStudent extends Student{
        constructor(name,grade) {
            super(name);//这里使用super(name) 直接完成了父类构造器中 this.name = name;
            this.grade = grade;
        }
        hi(){
            alert('我是小学生');
        }
    }
    var xiaohong = new LittleStudent('xiaohong',100);

操作BOM对象

BOM:浏览器对象模型

JS诞生就是为了能够让它在浏览器中运行!

封装了浏览器的信息

navigator.appVersion
'5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/99.0.4844.51 Safari/537.36'

navigator.userAgent
'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/99.0.4844.51 Safari/537.36'

navigator.platform
'Win32'

大多数时候,我们不会使用navigator对象,因为会被人为修改

不建议使用这些属性来判断和编写代码

screen

代表屏幕尺寸

screen.width
1536
screen.height
864

location

代表当前页面的URL信息

location.assign()//设置新的地址 所有访问这个网站的都会打开这个新的地址

document

document 代表当前页面,HTML DOM文档树

document.title;//获取title
document.getElementById();//获取具体的文档树通过Id
document.cookie;//获取cookie

!!document.cookie 是实现劫持cookie的一步!!

服务器端可以设置 cookie: httpOnly

history

history.back()//后退
history.forward()//前进

操作DOM

DOM: 文档对象模型

核心

浏览器网页就是一个DOM树形结构!

  • 更新:更新DOM节点
  • 遍历DOM节点:得到DOM节点
  • 删除:删除一个DOM节点
  • 添加:添加一个新的节点

要操作一个DOM节点,就必须要先获得这个DOM节点

获得DOM节点

<div id="father">
    <h1>nihao</h1>
    <a href="#" class="a1">111</a>
    <p id="p1">hihihi</p>
</div>

<script>
    var h1 = document.getElementsByTagName("h1");
    var a1 = document.getElementsByClassName('a1');
    var p1 = document.getElementById('p1');
    var father = document.getElementById('father');
    var childrens = father.children;//获取父节点下所有子节点
</script>

这是原生代码,之后更多使用jQuery

更新节点

.innerText

修改文本的值

.innerHTML

可以解析文本标签

.style

可以操作修改CSS

删除节点

步骤:先获取父节点,再通过父节点删除自己。

.removeChild() 括号里面填写需要删除的节点

注意!必须是用父节点来删除子节点!!

father.removeChild(p1);

获取父类的方法:

.parentElement

var father = p1.parentElement;

删除是一个动态的过程

如果father有三个孩子,可以利用索引来删除

father.removeChild(father.Children[]);//[]中填写索引

三个孩子索引分别为0,1,2 。如果删除了1,这个时候,索引就变了,只有0,1。

这就是删除是一个动态的过程

father.removeChild(father.Children[0]);
father.removeChild(father.Children[1]);
father.removeChild(father.Children[2]);

上面这样删除三个孩子就会报错。

注意:删除多个节点的时候,children是在时刻变化的,一定要注意

插入节点

我们获得了某个节点,假设这个节点是空的,我们通过innerHTML 就可以增加一个元素,但是这个DOM节点如果已经存在元素了,我们就不能这么干了,因为会产生覆盖。

追加

var p2 = document.getElementById('p2');
undefined
var father = p2.parentElement;
undefined
father.appendChild(document.getElementById('p1'));//追加到后面(已存在的节点)

效果:

创建一个新节点,并追加去父节点

document.createElement() 括号内填写节点类型,用引号包裹

    var p6 = document.createElement('p');//创建一个p标签节点
    p6.id = 'p6';
    p6.innerText = 'nishiwoer'
    father.append(p6);

万能写法

可以创建script标签 style标签 并且写入里面的值

var myScript = document.createElement('script');
myScript.setAttribute('type','....')//填key和value

这样,通过setAttribute,就可以修改任意的值

通过创建style标签来修改网页css设置

    var myStyle = document.createElement('style');//创建标签
    myStyle.innerText = 'body{background-color:red;}'//修改内容
    var head1 = document.getElementsByTagName("head")[0];//找到head标签 [0]是通过网页打印出来知道head标签的具体索引
    head1.appendChild(myStyle);//把style丢进去

操作表单

表单

  • 文本框 text
  • 下拉框 select
  • 单选框 radio
  • 多选框 checkbox
  • 隐藏域 hidden
  • 密码框 passw
  • ......

表单的目的,提交信息

获得要提交的信息

<form action="../11.DOM/demo01.html" method="get" >
    <p><span>用户名:</span><input type="text" id="user"></p>
    <p><input type="submit"></p>
</form>

<script>
    var text_user = document.getElementById('user');
</script>
//获取信息
text_user.value;
//修改信息
text_user.valun = '';

对于单选框或多选框等一些拥有固定的值的对象

        <span>性别:</span>
        <input type="radio" name="sex" value="man"><span>男</span>
        <input type="radio" name="sex" value="woman"><span>女</span>

如上,如果用.value的方法没有任何意义,他获取的是一个固定的值,而不是当前选中的值。

所以,我们要用.checked来判断,如果被选中会返回true,未被选中返回false

提交表单

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="md5.js"></script>
</head>
<body>
<!--onsubmit=“”绑定一个提交检测的函数 返回false true  false表单提交会被拦截-->
<form action="https://www.baidu.com/" method="post" onsubmit="return aaa()">
    <p>
        <span>用户名:</span><input type="text" name="username" id="uname">
    </p>
    <p>
        <span>密码:</span><input type="password" id="ipsw">
<!--        隐藏真正的密码框-->
        <input type="hidden" id="psw" name="psw">
    </p>
    <p>
        <button type="submit">提交</button>
    </p>

</form>

<script>
    function aaa(){
        var uname = document.getElementById('uname');
        var ipsw = document.getElementById('ipsw');
        var psw = document.getElementById('psw');
        console.log(uname.value);
        //ipsw.value = md5(ipsw.value); 这行代码会使表单提交一瞬间密码变长
        psw.value = md5(ipsw.value);//MD5加密
        console.log(psw.value);
        return false;//这里 true false 可以决定表单是否执行
    }
</script>
</body>
</html>

MD5

function md5(string) {
    function md5_RotateLeft(lValue, iShiftBits) {
        return (lValue << iShiftBits) | (lValue >>> (32 - iShiftBits));
    }
    function md5_AddUnsigned(lX, lY) {
        var lX4, lY4, lX8, lY8, lResult;
        lX8 = (lX & 0x80000000);
        lY8 = (lY & 0x80000000);
        lX4 = (lX & 0x40000000);
        lY4 = (lY & 0x40000000);
        lResult = (lX & 0x3FFFFFFF) + (lY & 0x3FFFFFFF);
        if (lX4 & lY4) {
            return (lResult ^ 0x80000000 ^ lX8 ^ lY8);
        }
        if (lX4 | lY4) {
            if (lResult & 0x40000000) {
                return (lResult ^ 0xC0000000 ^ lX8 ^ lY8);
            } else {
                return (lResult ^ 0x40000000 ^ lX8 ^ lY8);
            }
        } else {
            return (lResult ^ lX8 ^ lY8);
        }
    }
    function md5_F(x, y, z) {
        return (x & y) | ((~x) & z);
    }
    function md5_G(x, y, z) {
        return (x & z) | (y & (~z));
    }
    function md5_H(x, y, z) {
        return (x ^ y ^ z);
    }
    function md5_I(x, y, z) {
        return (y ^ (x | (~z)));
    }
    function md5_FF(a, b, c, d, x, s, ac) {
        a = md5_AddUnsigned(a, md5_AddUnsigned(md5_AddUnsigned(md5_F(b, c, d), x), ac));
        return md5_AddUnsigned(md5_RotateLeft(a, s), b);
    };
    function md5_GG(a, b, c, d, x, s, ac) {
        a = md5_AddUnsigned(a, md5_AddUnsigned(md5_AddUnsigned(md5_G(b, c, d), x), ac));
        return md5_AddUnsigned(md5_RotateLeft(a, s), b);
    };
    function md5_HH(a, b, c, d, x, s, ac) {
        a = md5_AddUnsigned(a, md5_AddUnsigned(md5_AddUnsigned(md5_H(b, c, d), x), ac));
        return md5_AddUnsigned(md5_RotateLeft(a, s), b);
    };
    function md5_II(a, b, c, d, x, s, ac) {
        a = md5_AddUnsigned(a, md5_AddUnsigned(md5_AddUnsigned(md5_I(b, c, d), x), ac));
        return md5_AddUnsigned(md5_RotateLeft(a, s), b);
    };
    function md5_ConvertToWordArray(string) {
        var lWordCount;
        var lMessageLength = string.length;
        var lNumberOfWords_temp1 = lMessageLength + 8;
        var lNumberOfWords_temp2 = (lNumberOfWords_temp1 - (lNumberOfWords_temp1 % 64)) / 64;
        var lNumberOfWords = (lNumberOfWords_temp2 + 1) * 16;
        var lWordArray = Array(lNumberOfWords - 1);
        var lBytePosition = 0;
        var lByteCount = 0;
        while (lByteCount < lMessageLength) {
            lWordCount = (lByteCount - (lByteCount % 4)) / 4;
            lBytePosition = (lByteCount % 4) * 8;
            lWordArray[lWordCount] = (lWordArray[lWordCount] | (string.charCodeAt(lByteCount) << lBytePosition));
            lByteCount++;
        }
        lWordCount = (lByteCount - (lByteCount % 4)) / 4;
        lBytePosition = (lByteCount % 4) * 8;
        lWordArray[lWordCount] = lWordArray[lWordCount] | (0x80 << lBytePosition);
        lWordArray[lNumberOfWords - 2] = lMessageLength << 3;
        lWordArray[lNumberOfWords - 1] = lMessageLength >>> 29;
        return lWordArray;
    };
    function md5_WordToHex(lValue) {
        var WordToHexValue = "",
            WordToHexValue_temp = "",
            lByte, lCount;
        for (lCount = 0; lCount <= 3; lCount++) {
            lByte = (lValue >>> (lCount * 8)) & 255;
            WordToHexValue_temp = "0" + lByte.toString(16);
            WordToHexValue = WordToHexValue + WordToHexValue_temp.substr(WordToHexValue_temp.length - 2, 2);
        }
        return WordToHexValue;
    };
    function md5_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;
    };
    var x = Array();
    var k, AA, BB, CC, DD, a, b, c, d;
    var S11 = 7,
        S12 = 12,
        S13 = 17,
        S14 = 22;
    var S21 = 5,
        S22 = 9,
        S23 = 14,
        S24 = 20;
    var S31 = 4,
        S32 = 11,
        S33 = 16,
        S34 = 23;
    var S41 = 6,
        S42 = 10,
        S43 = 15,
        S44 = 21;
    string = md5_Utf8Encode(string);
    x = md5_ConvertToWordArray(string);
    a = 0x67452301;
    b = 0xEFCDAB89;
    c = 0x98BADCFE;
    d = 0x10325476;
    for (k = 0; k < x.length; k += 16) {
        AA = a;
        BB = b;
        CC = c;
        DD = d;
        a = md5_FF(a, b, c, d, x[k + 0], S11, 0xD76AA478);
        d = md5_FF(d, a, b, c, x[k + 1], S12, 0xE8C7B756);
        c = md5_FF(c, d, a, b, x[k + 2], S13, 0x242070DB);
        b = md5_FF(b, c, d, a, x[k + 3], S14, 0xC1BDCEEE);
        a = md5_FF(a, b, c, d, x[k + 4], S11, 0xF57C0FAF);
        d = md5_FF(d, a, b, c, x[k + 5], S12, 0x4787C62A);
        c = md5_FF(c, d, a, b, x[k + 6], S13, 0xA8304613);
        b = md5_FF(b, c, d, a, x[k + 7], S14, 0xFD469501);
        a = md5_FF(a, b, c, d, x[k + 8], S11, 0x698098D8);
        d = md5_FF(d, a, b, c, x[k + 9], S12, 0x8B44F7AF);
        c = md5_FF(c, d, a, b, x[k + 10], S13, 0xFFFF5BB1);
        b = md5_FF(b, c, d, a, x[k + 11], S14, 0x895CD7BE);
        a = md5_FF(a, b, c, d, x[k + 12], S11, 0x6B901122);
        d = md5_FF(d, a, b, c, x[k + 13], S12, 0xFD987193);
        c = md5_FF(c, d, a, b, x[k + 14], S13, 0xA679438E);
        b = md5_FF(b, c, d, a, x[k + 15], S14, 0x49B40821);
        a = md5_GG(a, b, c, d, x[k + 1], S21, 0xF61E2562);
        d = md5_GG(d, a, b, c, x[k + 6], S22, 0xC040B340);
        c = md5_GG(c, d, a, b, x[k + 11], S23, 0x265E5A51);
        b = md5_GG(b, c, d, a, x[k + 0], S24, 0xE9B6C7AA);
        a = md5_GG(a, b, c, d, x[k + 5], S21, 0xD62F105D);
        d = md5_GG(d, a, b, c, x[k + 10], S22, 0x2441453);
        c = md5_GG(c, d, a, b, x[k + 15], S23, 0xD8A1E681);
        b = md5_GG(b, c, d, a, x[k + 4], S24, 0xE7D3FBC8);
        a = md5_GG(a, b, c, d, x[k + 9], S21, 0x21E1CDE6);
        d = md5_GG(d, a, b, c, x[k + 14], S22, 0xC33707D6);
        c = md5_GG(c, d, a, b, x[k + 3], S23, 0xF4D50D87);
        b = md5_GG(b, c, d, a, x[k + 8], S24, 0x455A14ED);
        a = md5_GG(a, b, c, d, x[k + 13], S21, 0xA9E3E905);
        d = md5_GG(d, a, b, c, x[k + 2], S22, 0xFCEFA3F8);
        c = md5_GG(c, d, a, b, x[k + 7], S23, 0x676F02D9);
        b = md5_GG(b, c, d, a, x[k + 12], S24, 0x8D2A4C8A);
        a = md5_HH(a, b, c, d, x[k + 5], S31, 0xFFFA3942);
        d = md5_HH(d, a, b, c, x[k + 8], S32, 0x8771F681);
        c = md5_HH(c, d, a, b, x[k + 11], S33, 0x6D9D6122);
        b = md5_HH(b, c, d, a, x[k + 14], S34, 0xFDE5380C);
        a = md5_HH(a, b, c, d, x[k + 1], S31, 0xA4BEEA44);
        d = md5_HH(d, a, b, c, x[k + 4], S32, 0x4BDECFA9);
        c = md5_HH(c, d, a, b, x[k + 7], S33, 0xF6BB4B60);
        b = md5_HH(b, c, d, a, x[k + 10], S34, 0xBEBFBC70);
        a = md5_HH(a, b, c, d, x[k + 13], S31, 0x289B7EC6);
        d = md5_HH(d, a, b, c, x[k + 0], S32, 0xEAA127FA);
        c = md5_HH(c, d, a, b, x[k + 3], S33, 0xD4EF3085);
        b = md5_HH(b, c, d, a, x[k + 6], S34, 0x4881D05);
        a = md5_HH(a, b, c, d, x[k + 9], S31, 0xD9D4D039);
        d = md5_HH(d, a, b, c, x[k + 12], S32, 0xE6DB99E5);
        c = md5_HH(c, d, a, b, x[k + 15], S33, 0x1FA27CF8);
        b = md5_HH(b, c, d, a, x[k + 2], S34, 0xC4AC5665);
        a = md5_II(a, b, c, d, x[k + 0], S41, 0xF4292244);
        d = md5_II(d, a, b, c, x[k + 7], S42, 0x432AFF97);
        c = md5_II(c, d, a, b, x[k + 14], S43, 0xAB9423A7);
        b = md5_II(b, c, d, a, x[k + 5], S44, 0xFC93A039);
        a = md5_II(a, b, c, d, x[k + 12], S41, 0x655B59C3);
        d = md5_II(d, a, b, c, x[k + 3], S42, 0x8F0CCC92);
        c = md5_II(c, d, a, b, x[k + 10], S43, 0xFFEFF47D);
        b = md5_II(b, c, d, a, x[k + 1], S44, 0x85845DD1);
        a = md5_II(a, b, c, d, x[k + 8], S41, 0x6FA87E4F);
        d = md5_II(d, a, b, c, x[k + 15], S42, 0xFE2CE6E0);
        c = md5_II(c, d, a, b, x[k + 6], S43, 0xA3014314);
        b = md5_II(b, c, d, a, x[k + 13], S44, 0x4E0811A1);
        a = md5_II(a, b, c, d, x[k + 4], S41, 0xF7537E82);
        d = md5_II(d, a, b, c, x[k + 11], S42, 0xBD3AF235);
        c = md5_II(c, d, a, b, x[k + 2], S43, 0x2AD7D2BB);
        b = md5_II(b, c, d, a, x[k + 9], S44, 0xEB86D391);
        a = md5_AddUnsigned(a, AA);
        b = md5_AddUnsigned(b, BB);
        c = md5_AddUnsigned(c, CC);
        d = md5_AddUnsigned(d, DD);
    }
    return (md5_WordToHex(a) + md5_WordToHex(b) + md5_WordToHex(c) + md5_WordToHex(d)).toLowerCase();}

jQuery

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/jQuery.js"></script>
</head>
<body>
<a href="#" id="a1">点我</a>
<script>
$('#a1').click(function (){
    alert('hello,jQuery')
})
</script>
</body>
</html>

通用公式

$(selector).action()

获取鼠标坐标

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/jQuery.js"></script>
    <style>
        div[id=mouseMove]{
            width: 500px;
            height: 500px;
            border: red solid 1px;
        }
    </style>
</head>
<body>
<div>
    <p><span>鼠标坐标 </span><span>X: </span><span id="mouseX"></span><span> Y: </span><span id="mouseY"></span></p>
    <div id="mouseMove"></div>
    <script>
        $('div[id=mouseMove]').mousemove(function (e) {
            $('span[id=mouseX]').text(e.pageX);//插入文本方法
            $('span[id=mouseY]').text(e.pageY);
        })
    </script>
</div>
</body>
</html>

更多用法 查询文档

https://jquery.cuishifeng.cn/

posted @ 2022-03-15 15:00  老哥不老  阅读(24)  评论(0编辑  收藏  举报