javaScript基础&DOM

2020-05-27 20:52:36 阅读：247 来源： 互联网

标签：articles www cnblogs DOM javaScript 基础 html https com

　　一、js的String对象
　　
　　查看W3CSchool文档，有该对象详细属性方法。
　　
　　
　　常用属性
　　
　　length :声明了该字符串中的字符数。
　　
　　<script type="text/javascript">
　　
　　var a = "drby";
　　
　　document.write(a.length); //4
　　
　　</script>
　　
　　常用方法
　　
　　与html相关的方法
　　
　　bold() : 使用粗体显示字符串。
　　
　　<script type="text/javascript">
　　
　　var str="Hello world!"
　　
　　document.write(str.bold()) //helloworld！显示为粗体【发现语句结束不加分号也能运行成功QAQ】
　　
　　</script>
　　
　　fontcolor() : 使用指定的颜色来显示字符串。
　　
　　<script type="text/javascript">
　　
　　var str="Hello world!"
　　
　　document.write(str.fontcolor("Red"))
　　
　　</script>
　　
　　fontsize() : 使用指定的尺寸来显示字符串
　　
　　<script type="text/javascript">
　　
　　var str="Hello world!"
　　
　　document.write(str.fontsize(7))
　　
　　</script>
　　
　　link(): 将字符串显示为链接。
　　
　　<script type="text/javascript">
　　
　　var str="this is a url"
　　
　　document.write(str.link("http://www.w3school.com.cn"))
　　
　　</script>
　　
　　sub() : 把字符串显示为下标。 sup() : 把字符串显示为上标。
　　
　　<script type="text/javascript">
　　
　　var str="Hello world!下标"
　　
　　document.write(str.sub())
　　
　　var str1="Hello world!上标"
　　
　　document.write(str1.sup())
　　
　　</script>
　　
　　技术分享
　　
　　与java相似的方法（）更多例子用法查看w3c文档
　　
　　concat() : 连接字符串。
　　
　　charAt() : 返回在指定位置的字符。
　　
　　indexOf() : 检索字符串。即返回字符位置
　　
　　split() : 把字符串分割为字符串数组。
　　
　　replace() : 替换与正则表达式匹配的子串。
　　
　　substr() substring() :
　　
　　<script type="text/javascript">
　　
　　//concat方法
　　
　　var str1 = "abc";
　　
　　var str2 = "dfg";
　　
　　document.write(str1.concat(str2));
　　
　　document.write("<hr>");
　　
　　//charAt方法
　　
　　var str3 = "abcdefg";
　　
　　document.write(str3.charAt(20)); //字符位置不存在，返回空字符串
　　
　　document.write(str3.charAt(3));
　　
　　document.write("<hr>");
　　
　　//indexOf方法
　　
　　var str4 = "poiuyt";
　　
　　document.write(str4.indexOf("y"));
　　
　　document.write(str4.indexOf("w")); //字符不存在，返回-1
　　
　　document.write("<hr>");
　　
　　//split方法【更多例子用法查看w3c文档】
　　
　　var str5 = "a-b-c-d";
　　
　　var arr1 = str5.split("-");
　　
　　document.write("length: "+arr1.length + "<br />");
　　
　　var str="How are you doing today?"
　　
　　document.write(str.split(" ") + "<br />")
　　
　　document.write(str.split("") + "<br />")
　　
　　document.write(str.split(" ",3))
　　
　　document.write("<hr>");
　　
　　//replace方法【更多例子用法查看w3c文档】
　　
　　var str6 = "abcd";
　　
　　document.write(str6);
　　
　　document.write("<br/>");
　　
　　document.write(str6.replace("a","Q")); //次处传两个参数，第一个原始字符，第二个是要替换成的字符
　　
　　document.write("<hr>");
　　
　　//substr方法
　　
　　var str7 = "abcdefghuiop";
　　
　　document.write(str7.substr(5,5)); //fghui 从第五位开始，向后截取几位
　　
　　document.write("<hr>");
　　
　　//substring方法
　　
　　var str8 = "abcdefghuiopqrst";
　　
　　document.write(str7.substring(3,5)); //de 从第几位开始到第几位结束 [3,5) 包左不包右
　　
　　</script>
　　
　　技术分享
　　
　　　　需要注意的是，JavaScript 的字符串是不可变的（immutable），String 类定义的方法都不能改变字符串的内容。像 String.toUpperCase() 这样的方法，返回的是全新的字符串，而不是修改原始字符串。
　　
　　二、js的Array对象
　　
　　常用属性
　　
　　length ：设置或返回数组中元素的数目。
　　
　　<script type="text/javascript">
　　
　　var arr = new Array(3)
　　
　　arr[0] = "John"
　　
　　arr[1] = "Andy"
　　
　　arr[2] = "Wendy"
　　
　　document.write("Original length: " + arr.length)
　　
　　document.write("<br />")
　　
　　arr.length=5
　　
　　document.write("New length: " + arr.length)
　　
　　</script>
　　
　　//结果：
　　
　　//Original length: 3
　　
　　//New length: 5
　　
　　常用方法
　　
　　concat(): 连接两个或更多的数组，并返回结果。
　　
　　该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。即返回一个新的数组。
　　
　　join(): 把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
　　
　　push(): 向数组的末尾添加一个或更多元素，并返回新的长度。
　　
　　push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject，而不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。
　　
　　如果添加的是一个数组，这个时候把数组当做一个整体字符串添加进去
　　
　　pop(): 删除并返回数组的最后一个元素
　　
　　pop() 方法将删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。
　　
　　reverse(): 颠倒数组中元素的顺序。
　　
　　该方法会改变原来的数组，而不会创建新的数组。
　　
　　<script type="text/javascript">
　　
　　//concat方法
　　
　　var arr1 = [1,2,3];
　　
　　var arr2 = [4,5,6];
　　
　　var arr3 = [7,8,9];
　　
　　document.write(arr1.concat(arr2) +"<br/>"); //1,2,3,4,5,6
　　
　　document.write(arr1.concat(arr2,arr3)); //1,2,3,4,5,6,7,8,9
　　
　　document.write("<hr>");
　　
　　//join方法
　　
　　var arr4 = new Array(3)
　　
　　arr4[0] = "George"
　　
　　arr4[1] = "John"
　　
　　arr4[2] = "Thomas"
　　
　　document.write(arr4.join() +"<br/>") //George,John,Thomas
　　
　　document.write(arr4.join(".")) //George.John.Thomas
　　
　　document.write("<hr>");
　　
　　//push方法
　　
　　var arr5 = new Array(3);
　　
　　arr5[0] = "tom";
　　
　　arr5[1] = "lucy";
　　
　　arr5[2] = "jack";
　　
　　document.write("old array: "+arr5);
　　
　　document.write("<br/>");
　　
　　document.write("old length:"+arr5.length);
　　
　　document.write("<br/>");
　　
　　document.write("new length: "+arr5.push("zhangsan"));
　　
　　document.write("<br/>");
　　
　　document.write("new array: "+arr5);
　　
　　document.write("<br/>","<br/>");
　　
　　var arr6 = ["www","qqq"];
　　
　　var arr7 = ["aaa","bbb","ccc"];
　　
　　document.write("old array:"+arr6 +"<br/>");
　　
　　document.write("old length:"+arr6.length +"<br/>");
　　
　　document.write("new length:"+arr6.push(arr7) +"<br/>"); //结果3 不是5 ，因为把arr7当做一个整体字符串（即一个元素）添加到arr6
　　
　　document.write("new array: "+arr6);
　　
　　for(var i=0;i<arr6.length;i++) {
　　
　　alert(arr6[i]);
　　
　　}
　　
　　document.write("<hr>");
　　
　　//pop方法
　　
　　var arr8 = ["zhangsan","lisi","wangwu","zhaoliu"];
　　
　　document.write("old array: "+arr8 +"<br/>");
　　
　　document.write("return: "+arr8.pop() +"<br/>");
　　
　　document.write("new array: "+arr8);
　　
　　document.write("<hr>");
　　
　　//reverser方法
　　
　　var arr9 = ["zhangsan1","lisi1","zhaoliu1","niuqi1"];
　　
　　document.write("old array: "+arr9);
　　
　　document.write("<br/>");
　　
　　document.write("new array:"+arr9.reverse());
　　
　　</script>
　　
　　技术分享
　　
　　三、js的Date对象
　　
　　在java里面获取当前时间
　　
　　Date date = new Date();
　　
　　//格式化
　　
　　toLocaleString() //xxxx年xx月xx日 xx:xx:xx
　　
　　js里面获取当前时间
　　
　　<script type="text/javascript">
　　
　　//获取当前时间
　　
　　var date = new Date();
　　
　　document.write(date); // Sat May 28 2016 22:33:17 GMT+0800 (中国标准时间)
　　
　　//转换成习惯的格式
　　
　　document.write("<hr/>");
　　
　　document.write(date.toLocaleString()); //‎2016‎年‎5‎月‎28‎日‎ ‎22‎:‎33‎:‎17
　　
　　</script>
　　
　　获取当前的年方法 getFullYear()
　　
　　var date = new Date();
　　
　　document.write("year: "+date.getFullYear()); //year: 2016
　　
　　获取当前的月方法 getMonth()
　　
　　<script type="text/javascript">
　　
　　//返回的是 0-11月，如果想要得到准确的值，加1
　　
　　var date = new Date();
　　
　　var date1 = date.getMonth()+1;
　　
　　document.write("month: "+date1);
　　
　　</script>
　　
　　获取当前的星期 getDay()
　　
　　<script type="text/javascript">
　　
　　//返回的是 (0 ~ 6)
　　
　　//外国朋友，把星期日作为一周的第一天，星期日返回的是0,而星期一到星期六返回的是 1-6
　　
　　var date = new Date();
　　
　　document.write("week: "+date.getDay());
　　
　　</script>
　　
　　获取当前的日 getDate()
　　
　　<script type="text/javascript">
　　
　　//得到当前的天 1-31
　　
　　var date = new Date();
　　
　　document.write("day: "+date.getDate());
　　
　　</script>
　　
　　获取当前的小时 getHours()
　　
　　<script type="text/javascript">
　　
　　//得到当前的小时 0~23
　　
　　var date = new Date();
　　
　　document.write("hour: "+date.getHours());
　　
　　</script>
　　
　　获取当前的分钟 getMinutes()
　　
　　<script type="text/javascript">
　　
　　var date = new Date();
　　
　　document.write("minute: "+date.getMinutes());
　　
　　</script>
　　
　　获取当前的秒 getSeconds()
　　
　　var date = new Date();
　　
　　document.write("second: "+date.getSeconds());
　　
　　获取毫秒数 getTime() 【返回的是1970 1 1 至今的毫秒数】 setTime() 根据毫秒数设置时间
　　
　　var date = new Date();
　　
　　document.write("second: "+date.getTime());
　　
　　应用场景：
　　
　　常用在防止浏览器缓存时候，比如银行网站就不需要缓存
　　
　　使用毫秒数处理缓存的效果（不有缓存） http://www.baidu.com?毫秒数
　　
　　四、js的Math对象
　　
　　Math 对象并不像 Date 和 String 那样是对象的类，因此没有构造函数 Math()，像 Math.sin() 这样的函数只是函数，不是某个对象的方法。无需创建它，通过把 Math 作为对象使用就可以调用其所有属性和方法。
　　
　　数学的运算。里面的都是静态方法，使用可以直接使用 Math.方法()
　　
　　ceil(x): 向上舍入
　　
　　<script type="text/javascript">
　　
　　var mm = 10.3;
　　
　　//不用创建math对象
　　
　　document.write(Math.ceil(mm)); //11
　　
　　</script>
　　
　　floor(x)：向下舍入
　　
　　round(x)：四舍五入
　　
　　random()：得到随机数（伪随机数）（返回 0.0 ~ 1.0 之间的随机数。）
　　
　　得到0-9的随机数
　　
　　Math.random()*10
　　
　　Math.floor(Math.random()*10)); //Math.floor舍去小数部分
　　
　　五、js的全局函数
　　
　　六、js的函数的重载

标签：articles,www,cnblogs,DOM,javaScript,基础,html,https,com
来源： https://www.cnblogs.com/pengy/p/12976499.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javaScript基础&DOM