JavaScript

2018-06-24 01:09:50来源：未知阅读 ()

　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　愿得一人心，白首不相离

什么是javaScript？就是java语言的一种补充，还有什么其它的给个链接 https://baike.baidu.com/item/javascript/321142?fr=aladdin，没事喽两眼，哈哈

  1 Js 对象
  2 
  3 使用new 关键字来创建对象，举例如下，
  4 
  5 var a = new String();
  6 如构造函数无参数，则不必加括号，
  7 
  8 JS内部对象
  9 数组（Array）对象
 10 创建数组
 11 var myarray = new Array(0);   //创建一个长度为0的数组
 12 
 13 var myarray = new Array(1,2，3);  //创建一个指定长度的数组，禀赋初值
 14 数组长度不固定，赋值即可改变长度，数组的主要属性为lengh,返回数组长度，
 15 
 16 数组的常用方法：
 17 reverse 方法 ：将JavaScript 数组对象内容反转。
 18 contact 方法 ：将两个或更多数组组合在一起，举例如下。
 19 
 20 var newArray  = tmtArray.contact(tmpArray);
 21 
 22 join 方法：返回一个将数组所有元素用指定符号连在一起的字符串，举例如下：
 23 
 24 var newArray = tmpArray.join(".");
 25 
 26 pop()方法：移除数组中的最后一个元素，并返该元素
 27 shift（）方法：将移除数组中的第一个元素，并返回该元素
 28 slice（）方法：返回数组的一部分，
 29 
 30 var newArray = tmpArray.slice（1,3）；
 31 
 32 日期（Date）对象
 33 
 34 Date 对象可以用来表示任意的时间和日期
 35 
 36 创建Date 
 37 
 38 必须使用new操作符来创建对象
 39 
 40 var date = new Date（“2017,12,26”）；
 41 
 42 获取日期的时间和方法：
 43 
 44 getYear();返回年数
 45 getMonth（）;返回当日号数
 46 getDay（）；返回星期几，0代表周日
 47 
 48 gethours();返回小时数，
 49 getMinutes（） 返回分钟数
 50 getSeconds();返回秒数
 51 getTime 返回毫秒数
 52 
 53 设置日期和时间的方法：
 54 
 55 
 56 
 57 setYear();设置年数
 58 setMonth（）;设置当日号数
 59 setDay（）；设置星期几，0代表周日
 60 
 61 sethours();设置小时数，
 62 setMinutes（） 设置分钟数
 63 setSeconds();设置豪秒数
 64 setTime 设置毫秒数
 65 
 66 
 67 String 对象
 68 
 69 创建String对象
 70 创建字符串对象的示例代码如下
 71 var firstString = “this is a String”;
 72 var secondString =  new String ("this is a String");
 73 
 74 String 对象的主要属性为length，返回字符串长度
 75 
 76 String对象的常用方法：
 77 charAt 返回指定索引位置处的字符，索引从0开始
 78 contact（str）连续字符串
 79 indexof(str) 返回String 对象内第一次出现字符串的字段位置（从左到右查找）
 80 
 81 lastindexof(str) 返回String对象中子字符串最后出现的位置
 82 replace(str1,str2)返回将str替换为str2后的字符串
 83 split（s.l）  将字符串s作为分隔符，切割成多个字符串，并将它返回一个数组，如果有l参数，则返回数组l个因素；
 84 SubString返回一个指定位置之间的子字符串，包头不包尾、
 85 tolowerCase，返回字符串，转小写
 86 toUpperCase  返回字符串，转大写
 87 
 88 
 89 Math 对象
 90 
 91 Math对象是全局对象，使用时不需要创建，
 92 Math对象的属性
 93 
 94 LN10；10的自然对数
 95 LN2；2的对数
 96 PI：圆周率
 97 SQRT1_2:1/2的平方根
 98 
 99 SQRT2：2的平方根
100 
101 abs（x）返回x的绝对值
102 celi（x）返回大于等于X的最大整数
103 floor（x）返回小于等于X的最大整数
104 round（x）舍入到最近整数
105 sqrt（x）返回X的平方根
106 random():  返回0~1之间的随机数
107 
108 Js对象模型
109 
110 窗口（window）对象
111 
112 使用Open()方法可打开一个新窗口，示例代码如下，
113 open 方法有3个参数：第一个参数代表要载人新窗口页面的URL，第二个参数代表新窗口的名称，第三个参数代表窗口的属性，多个属性间
114 
115 用逗号隔开，
116 
117 对话框（与用户交互）方法
118 alert
119 该方法的功能是弹出一个提示框
120 prompt
121 该方法的功能是弹出可以输入信息的文本框，第一个参数代表文本框的默认值
122 confirm
123 该方法的功能是弹出对话框，提示确认信息，示例代码如下
124 
125 history
126 history对象记录着浏览器浏览过的每一个页面，这些页面组成了一个历史记录列表，它有3个有效方法：
127 forward();将历史记录向前移动一个页面。
128 back（）；将历史记录向后移动一个页面，网页中经常使用该方法提供一个返回功能
129 go 转向历史记录中指定地址，使用此方法需要一个参数，参数可以是正负整数或字符串。如果参数是字符串，那么浏览器就会被搜索列表
130 
131 ，找到最接近当前页面位置且url 地址中含有此字符串的页面，然后跳转到该页面。
132 
133 location对象
134 
135 window对象的location属性可以直接改变URL地址，
136 
137 
138 还可以使用location对象的href属性清空页面，
139 
140 还可以使用location 对象的href 属性或replace（URL）方法改变URL地址，
141 
142 
143 document 对象
144 
145 forms集合 
146 
147 在同一个页对象面上有多个表单，通过document。forms[]数组获得这些表单对象要比使用表单名称方便的多
148 
149 getELementById(id)方法
150 该方法的功能是获得指定id值的表单控件
151 getELementByName(name)
152 该方法的功能是获得指定name值得表单控件对象，返回的是对象数组。
153 
154 document.forms[0]; //通过forms对象的索引
155 
156 document.forms["myForm"];  // 通过forms对象和表单名称
157 
158 document.myForm;     // 通过表单名称
159 
160 
161 使用document对象示例代码如下：
162 
163       <script type="text/javascript" src="引入JS的文件">
164       function t(){
165       
166           /*
167           通过表单获取控件
168           */
169           var name_1 = document.forms[0].nameTest;
170           //var name_1 = document.forms["myform"].nameTest;
171           //var name_1 = document.myform.nameTest;
172           //var name_1 = document.myform.elements["nameTest"]
173            alert("name_1="+name_1.value);
174       
175           /*
176           通过name获取控件
177           */
178           var name_1 = document.getElementsByName("nameTest")
179            alert("name_1="+name_1.value);
180           /*
181           通过ID获取控件
182           */
183           
184            var name_1 = document.getElementsById("idTest")
185            alert("name_1="+name_1.value);
186       
187       
188       }
189       
190            
191    </script>
192   <body>
193   
194    <form action="myform">
195    
196    通过name 获取：<input type="text" name="nameTest" value="firstTextValue"><br>
197     通过id获取：<input type="text" id="idTest"value="secondTextValue"> <br>
198 
199   <input type="button" value="点击我" onclick="t()">
200    
201    </form>
202    
203   </body>
204 
205 
206 操作HTML
207 1.事件处理
208 通常将鼠标或热键的动作成为事件
209 
210 （1） 窗口或页面的事件处理
211     窗口和页面的事件处理
212 
213 
214 事件    说明
215 onblur    当前元素失去焦点时触发
216 onfocus    当某个元素获得焦点时触发
217 onload    页面内容完成装载时触发
218 onUpload    页面内容完成装载时触发
219     当前页面被退出或重置时触发
220 
221 
222 键盘或鼠标的事件处理
223 
224 
225 事件    说明
226 onClick    当鼠标单击时触发
227 onDbClick    当鼠标双击时触发
228 onMouseDown    当按下鼠标时触发
229 onMouseMove    当鼠标移动时触发
230 onMouseOut    当鼠标离开某对象范围时触发
231 onMouseOver    当鼠标移动到某对象范围上方时触发
232 onMouseUp    当鼠标按下后松开鼠标时触发
233 onKeyPress    当键盘上的某个键被按下并且释放时触发
234 onKeyDown    当键盘上某个键被按下时触发
235 OnKeyUp    当键盘上某个键被按放开时触发
236 
237 表单元素的事件处理
238 
239 button  按钮    onClick onBlur onFocus
240 checkbox  复选框    onClick onBlur onFocus
241 file  上传文件    onClick onBlur onFocus
242 password  密码框    onBlur  onfocus onSelect
243 radio  单选按钮    onClick onBlur onFocus
244 select  列表    onFocus onBlur onChange
245 text  文本框    onClick onBlur onFocus onChange
246 textarea 文本域    onClick onBlur onFocus onChange
247 
248 
249 
250 表单元素
251 表单元素的通用属性与方法：
252 form属性：获取该表单控件所属的表单对象
253 name ：获取或设置表单控件的名称
254 type 获取表单控件的类型
255 value 获取和设置表单控件的值
256 focus方法：让表单控件对象获得焦点
257 blur 让表单控件对象失去焦点
258 
259 
260 文本框
261 
262 value属性： 获得文本框的值，值是字符串类型
263 defaultValue属性：获得文本框的默认值，值是字符串类型
264 readonly属性： 只读，文本框中的内容不能修改，
265 focus方法：获得焦点，即获得鼠标光标。
266 blur：失去焦点
267 select方法：选中文本框内容，突出显示输入区域。
268 
269 复选框：
270 
271 checked属性：复选框是否被选中，选中为true，未选中为false。
272 value属性：设置或获取复选框的值
273 
274 单选框值：
275 checked：  单选按钮是否被选中，选中为true，为选中为false
276 value属性： 设置或获取单选按钮的值。
277 
278 下拉列表：
279 
280 length 属性：选项个数
281 selectIndex属性：当前被选中选项的索引
282 options属性 ：所有的选项组成一个数组，options表示整个选项数组，第一个选项即为options[0],第二个即为options[1].其它以此类推
283 
284 。
285 option 的value属性：<option>标记中value所指定的值
286 option 的text属性，显示于界面中的文本，即<option>....</option> 之间的一部分
287 
288 增加选项；每个选项都是一个option对象，可以创建option对象，然后添加到select末尾，如select，options[select,length] = new 
289 
290 Option(text,value)；。