Blogger Information
Blog 14
fans 0
comment 0
visits 7544
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
访问器属性,类与构造器函数,document.querySelector用法
Bruce.lau
Original
989 people have browsed it
  1. 理解访问器属性原理与应用场景,并实例演示 2. 实例演示获取dom元素的二个重要方法

访问器属性

访问器属性:用于创建对象的函数,即将方法伪装属性化,既有属性的特点,又有方法的功能。
关键字:get set
举例:

  1. //创建对象
  2. let user={
  3. name:'kim',
  4. age:33,
  5. info:{
  6. tel:'15888888888',
  7. gender:'man',
  8. hobby:'games',
  9. },
  10. //获取电话号码,伪装成类的方法
  11. get tel(){
  12. return this.info.tel
  13. },
  14. //更新电话号码
  15. set tel(tel){
  16. this.info.tel =tel
  17. }
  18. };
  19. //调用对象方法
  20. console.log(user.tel);//输出15888888888
  21. console.log(user.tel='13999999999')//输出13999999999

类与构造器函数

创建类

  1. class user{
  2. static salary = 300;//静态变量
  3. constructor(name,age){
  4. //对象初始化
  5. this.name=name,
  6. this.age=age
  7. }
  8. //创建对象方法
  9. info(){
  10. return this.name+'---'+this.age
  11. }
  12. }
  13. //用new创建类
  14. let guest =new user('guest',22);
  15. //调用方法
  16. console.log(guest.name);
  17. console.log(user.salary);//用原型调用静态变量

获取DOM元素

DOM = Document Object Model

获取:

  1. document.querySelectorAll(属性/ID),获取一组数据;
  2. document.querySelector,返回一组元素的第一个;
  3. document.documentElement,获取html跟元素
Correcting teacher:PHPzPHPz

Correction status:qualified

Teacher's comments:
Statement of this Website
The copyright of this blog article belongs to the blogger. Please specify the address when reprinting! If there is any infringement or violation of the law, please contact admin@php.cn Report processing!
All comments Speak rationally on civilized internet, please comply with News Comment Service Agreement
0 comments
Author's latest blog post