我的传智播客之javaweb

    xiaoxiao2021-03-25  140

    js的String对象

    创建String对象 var str = "abc"; 属性 length:字符串的长度方法: 与html相关的方法(设置样式) // bold(): 加粗 var str1 = "abc"; document.write(str1.bold()); // fontColor(): 设置字符串的颜色 var str2 = "abc"; document.write(str2.fontColor("red")); // fontSize(): 设置字体的大小 1-7 var str3 = "abc"; document.write(str3.fontSize(7)); // link(): 将字符串显示成超链接 var str4 = "abc"; document.write(str4.link("hello.html")); // sub()、sup():设置上标、下标 与java相似的方法 // concat(): 连接字符串 var str1 = "abc"; var str2 = "def"; document.write(str1.concat(str2)); // abcdef // charAt(): 返回指定位置的字符 var str3 = "abcdef"; document.write(str3.chatAt(0)); // a document.write(str3.chatAt(20)); // 字符位置不存在,返回空字符串 // indexof(): 返回字符串的位置 // split(): 把字符串切割成数组 // replace(): 替换字符串 参数:(原始字符串,要替换成的字符串) // substr()和substring(): var str7 = "abcdefghijk"; document.write(str7.substr(5, 5)); // fghij 从第5位开始向后截5个字符 document.write(str7.substring(3, 5)); // de 从第几位开始到第几位结束 [3, 5)

    js的Array对象

    创建数组(三种) // 创建空数组 var arr = []; var arr = new Array(); 属性:length 数组的长度方法: // 1.concat(): 连接数组 var arr1 = [1,2,3]; var arr2 = [4,5,6]; document.write(arr1.concat(arr2)); // 1,2,3,4,5,6 // 2.join(): 根据指定的字符分割数组 var arr3 = [1,2,3]; document.write(arr3); // 1,2,3 document.write(arr3.join("-")); // 1-2-3 // 3.push(): 向数组末尾添加元素,返回数组的新的长度 var arr5 = [1,2,3]; document.write(arr3.length); // 3 document.write(arr3); // 1,2,3 document.write(arr3.push("4")); // length: 4 document.write(arr3); // 1,2,3,4 // 如果添加的是一个数组,这时候把数组当作一个整体添加进去 var arr6 = ["aaa","bbb","ccc"]; var arr7 = ["ddd","eee"]; document.write(arr6.push(arr7)); // length: 4 // 4.pop(): 删除最后一个元素,返回被删除的那个元素 var arr8 = [1,2,3]; document.write(arr6.pop()); // 3 document.write(arr6); // 1,2 // 5.reverse(): 颠倒数组中元素的顺序

    js的Date对象

    在java里获取当前时间 Date date = new Date(); // 1.格式化代码 // 2.toLocaleString(); 在js里获取当前时间 var date = new Date(); // Fri Apr 17 10:47:46 UTC+0800 2015 date.toLocaleString(); // 2015年4月16日.... // getFullYear(): 得到当前的年 // 不要用getYear() date.getFullYear(); // 当前年 // getMonth(): 获取当前的月 // 返回的是0-11月,想要返回准确的值需+1 date.getMonth() + 1; // 当前月 // getDay(): 获取当前的星期 // 返回的是0-6, 0: 星期日 // getDate(): 获取当前的日 // getHours(): 获取当前的小时 // getMinutes(): 获取当前的分钟 // getSeconds(): 获取当前的秒 // getTime(): 获取毫秒数 自1970 1 1 至今的毫秒数 // 应用场景:使用毫秒数处理缓存的效果(没有缓存) http://baidu.com?毫秒数

    js的Math对象

    数学的运算,里面都是静态方法Math.xxx()。 Math.ceil(): 向上取整 Math.floor(): 向下取整 Math.round(): 四舍五入 Math.random(): 返回随机数(伪随机数) 0.0-1.0 Math.pow(x,y) Math.PI

    js的全局函数

    不属于任何一个对象,直接使用函数 // eval(): 执行字符串中的js代码 var str = "alert('1234')"; eval(str); // encodeURI(), encodeURIComponent(): 对字符进行编码 // decodeURI(), decodeURIComponent(): 对字符进行解码 var str1 = "测试aaa123"; var encode1 = encodeURI(str1); // "测试aaa123" var decode1 = decodeURI(encode1); // "测试aaa123" // isNaN(): 判断是否是数字 // 如果是数字,返回false;不是数字,返回true var str = "aaa"; isNaN(str) // true // parseInt(): 类型转换 var str = "123"; parseInt(str) + 1; //124

    js的函数重载

    js不存在重载,只调用最后一个方法。传递的参数保存到arguments里。但是可以通过arguments数组实现模拟重载。 function add1() { if (arguments.length == 2) { return ... } else if (arguments.length == 3) { return ... } else { return ... } }

    js的bom对象

    bom:browser object model 浏览器对象模型。

    对象: // nevigator: 获取客户机(浏览器)的信息 navigator.appName; // screen: 获取屏幕的信息 screen.height; // location: 请求url地址 // -href //获取URL地址 location.href; //设置url地址 location.href = "xxx.html"; // history: 请求的url的历史记录 // 到访问的上一个页面 history.back(); history.go(-1); // 到访问的下一个页面 history.forward(); history.go(1); // window: // 1.窗口对象 // 2.js的顶层对象(所有的bom对象都是在window里面操作) // 方法 // window.alert(): 警告框 // 简写:alert(); // confirm(): 确认框 var flag = confirm("显示的内容"); // 返回true 或 false // prompt(): 输入对话框 prompt(text, defaultText); // open(): 打开一个新的窗口 open("hello.thml", "", "width=200,height=100"); // close(): 关闭窗口 // 定时器 // setInterval("js代码",毫秒数): // 表示每三秒执行一次alert() var id1 = setInterval("alert('123')", 3000); // 返回id // setTimeout("js代码",毫秒数): // 表示在毫秒数之后执行,但只执行一次 var id2 = setTimeout("alert('123')", 3000); // 返回id // clearInterval(): 清除setInterval设置的定时器,传入id clearInterval(id1); // clearTimeout(): 清除setTimeout设置的定时器,传入id clearTimeout(id2);

    js的dom对象

    dom:document object model 文档对象模型

    文档:超文本标记文档 html、xml对象:提供属性和方法模型:使用属性和方法操作超文本标记型文档使用js的dom所提供对象,使用这些对象的属性和方法对标记型文档内容进行操作。想要对标记型文档进行操作,首先将文档的所有内容(html里的标签,属性,文本内容)封装成对象。解析过程:根据html层级结构在内存中分配一个树形结构,需要把html中的每部分封装成对象。 document对象:整个html文档element对象:元素(标签)对象属性对象、文本对象:依附在element对象上Node对象:上述所有对象的父对象DOM模型(3种)DHTML:很多技术的简称 html、css、dom、js

    document对象

    表示整个文档常用方法 // write(): 向页面输出变量(值)、html代码 // getElementById(): 通过id得到元素(标签) <input type="text" id="nameid" value="aaa"/> // 得到input标签 var input1 = document.getElmentById("nameid"); // 得到input里面的value值 input1.value; // 向input里面设置value值 input1.value = "bbb"; // getElementsByName(): 通过标签的name属性值返回一个集合 <input type="text" name="name1" value="aaa"/> <input type="text" name="name1" value="bbb"/> // 得到input标签 var inputs = document.getElmentsByName("name1"); inputs.length; // 遍历数组 for (var i=0;i<inputs.length;i++){ var input1 = inputs[i]; intpu1.value; } // getElementsByTagName(): 通过标签名称返回一个集合 var inputs = document.getElmentsByTagName("input"); // ... 与上面一样

    案例 window弹窗

    实现过程 创建主页面 有两个输入项和一个按钮按钮上有一个事件: 弹出一个新窗口 open创建弹出页面 表格 每一行都有一个按钮、编号和姓名按钮上有一个事件: 把当前的编号和姓名赋值到主页面的输入项位置 // window.html <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body> 姓名:<input type="text" id="name"> <br/> 编号:<input type="text" id="no"> <br/> <input type="button" value="选择" onclick="open1()"> </body> <script type="text/javascript"> function open1() { window.open("user.html", "", "width=250,height=150"); } </script> </html> // user.html <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"> </head> <body> <table> <tr> <td>操作</td> <td>姓名</td> <td>编号</td> </tr> <tr> <td> <input type="button" value="选择" onclick="s1('小明','01')"> </td> <td>小明</td> <td>01</td> </tr> <tr> <td> <input type="button" value="选择" onclick="s1('小黑','02')"> </td> <td>小黑</td> <td>02</td> </tr> <tr> <td> <input type="button" value="选择" onclick="s1('小白','03')"> </td> <td>小白</td> <td>03</td> </tr> </table> </body> <script type="text/javascript"> function s1(name, no) { var pwin = window.opner; pwin.document.getElementById("name").value = name; pwin.document.getElementById("no").value = no; close(); } </script> </html> 做这个案例会有一个问题,由于我们现在访问的是本地文件,js安全性,谷歌浏览器不允许访问本地文件。在实际开发中,没存在这种问题,实际中不可能访问本地的文件。(后来发现,好像都不行。在user.html发现无法获取主窗口引用)。
    转载请注明原文地址: https://ju.6miu.com/read-5861.html

    最新回复(0)