10月23号作业
1、练习JS创建对象、属性、方法。
2、练习通过jquery的id、class选择器选择元素,$.each遍历数组
一、JS对象对象的创建
对象的创建有三种方法:
1、Object()
2、{}新建对象
3、在{}内定义
<script> var obj=Object(); obj.name = '通过Object()为对象定义属性'; obj.hello=function(a,b){return ('通过Object()为对象定义方法:'+(a+b)); }; console.log(obj.hello(1,2));//调用对象中方法 console.log(obj); //调用对象中属性 var obj2 = {}; obj2.name = '通过{}为对象定义属性'; obj2.hello = function (a,b){return ('通过{}为对象定义方法:'+(a+b)); }; console.log(obj2.hello(1,2));//调用对象中方法 console.log(obj2); //调用对象中属性 var obj3 = { name :'通过{}内定义对象属性', hello : function (a,b){return ('通过{}内定义对象方法:'+(a+b)); }, }; console.log(obj3.hello(1,2));//调用对象中方法 console.log(obj3); //调用对象中属性 </script>
4、JS对象内访问this即是访问对象本身
修改对象内储存地址信息,对象发生同步更改
<script> var obj = { name:'需要读取数据', choose:function(){return this.name}, choosefirst:function(){return this}, } console.log('原obj中name'+obj.choosefirst().choose()); obj.name ='更改数据'; console.log('修改对象同一储存地址信息,对象发生更改:'+obj.choosefirst().choose()); </script>
二、练习通过jquery的id、class选择器选择元素
通过class寻找: $('.input_class')
通过id寻找: $('#input_id')
通过标签寻找: $('input')
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <script src="jquery-3.4.1.min.js"></script> </head> <body> <input type="text" class="input_class" id="input_id" value="admin" /> <div type="text" class="div_class" id="div_id" >admin</div> </body> </html> <!--通过自己写的"jquery"输出元素的值--> <script> // console.log($('.input_class')); console.log('通过class寻找:'+$('.input_class').val()); console.log('通过id寻找:'+$('#input_id').val()); console.log('通过标签寻找:'+$('input').val()); </script>
三、$.each遍历数组
$.each(arr,function (i,v) {});
其中 arr 为目标数组 function为对目标数组进行的方法处理
<script> var arr = [1,2]; $.each(arr,function (i,v) { console.log('小标是:'+i +'值:'+v); }); test = '123456789'; console.log($(test).length);//计算元素长度 </script>