日度归档:2020年2月12日

css中兼容各种浏览器的写法前缀有哪些呢?


摘要:
下文讲述css代码中兼容不同浏览器内核的写法分享,如下所示:

我们知道不同的浏览器内核对具有相同功能的css属性,在内部定义时,前缀有些小小不同,
例:
border-radius属性
需兼容所有浏览器,需采用以下写法
div{
border-radius:***;
-ms-border-radius:***; //兼容旧浏览器
-moz-border-radius:***;
-o-border-radius:***;
-webkit-border-radius:***;
}
那么这些前缀都代表什么呢?

1、-moz-代表firefox浏览器私有属性
2、-ms-代表ie浏览器私有属性
3、-webkit-代表safari、chrome私有属性
4、-o-代表Opera

那么为什么有这么多兼容旧浏览器的写法呢?
因为在w3c制定标准,需要很久的时间才会审核通过,
而浏览器商需抢占市场先机,需提前支持这些好的css写法,就采用加入前缀的方式使其提前支持其属性。

html table标签中的常见组成部分简介说明


摘要:
下文讲述在html代码中table的组成部分,如下所示:

table:
在Html中的功能是绘制表格,那么html由哪些元素组成呢,如下:

1.<table> 用于定义table
2.<caption> 表格标题
3.<th> 表格的表头
4.<tr> 表格中行开始标签
5.<td> 表格单元格
6.<thead> 表格页眉
7.<tbody> 表格主体
8.<tfoot> 表格页脚
9.<col> 表格列 属性
10.<colgroup> 表格列组

javascript 中js构造函数简介说明


摘要:
下文讲述javascript中js构造函数简介说明,如下所示:

写在前面的话:
js函数说明:
我们将一批代码封装起来,并命名供js作用域内部调用,我们将这一组封装的代码称之为“函数”。
js中函数定义有以下三种方式:

方式1:
function 函数名称(函数参数){
 
}
 
方式2:
let 函数名=function(参数名){
 
}
 
方式3:
var 函数名 = new Function(arg1,arg2,…argN,body);
arg1,arg2,…argN:所有为字符串的参数
 
body:为待创建的函数体。


二、构造函数

  js构造函数:
使用“new 函数名称”的方式实例化对象称之为“构造函数”,出“箭头函数”不能拥有构造函数的方式存在,其它函数都拥有构造函数的模式。
js构造函数会new一个新的函数对象,是一个创建新对象的过程。
常见的js构造函数:

      var arr = [];     为      var arr = new Array();       的语法糖。
      var obj = {}     为      var obj = new Object();     的语法糖
      var  date = new Date();
	

例:

 
      function Test(name,age,sex){

        this.name = name;

        this.age = age;

        this.sex = sex;

      }

             let f1 = new Test();

               Test.prototype.showInfo = function(){
                  alert('这是为Test类新增的一个方法');
      }

             
      let f2 = new Foo ('maomao',28,'女');

        let   f3 = {};   //一个Object对象被赋值
            f3.__proto__ = Foo.prototype; // f 继承 Foo的原型。   
   
        Test.call(f3,'maomao365.com',38,'女');    //执行Foo函数,将name,age,sex 参数传入Foo中执行,此时函数内部this 为 new 创建的 f对象,所以  f.name = 'zh';f.age = 18; f.sex = '男';
            f3.showInfo(); 


三、ES6 中 class 与构造函数的关系

  class 为 构造函数的语法糖,即 class 的本质是 构造函数。class的继承 extends 本质 为构造函数的原型链的继承。

  // 类的写法

  class Test{  //定义一个名字为Test的类

    constructor(name,age){ //constructor是一个构造方法,用来接收参数
      this.name = name;  //this代表实例对象
      this.age = age;
    } 
    showInfo(){  //这是一个类的方法,注意千万不要加上function
      return   this.name + this.age
    }
  }

  var obj = new Test('猫猫',38);
      alert(obj.showInfo());

   
       //构造函数的写法

    function Test(name,age){   //构造函数和实例化构造名相同且大写(非强制,但这么写有助于区分构造函数和普通函数)
      if(!(this instanceof Test)){ //避免使用者不小心讲Person当作普通函数执行
         throw new Error(''请使用 new Test"); //仿ES6 class 中的写法
      }
      this.name = name;
      this.age = age;
    }

    Test.prototype.showInfo = function(){
      return   this.name + this.age
    }

  var obj = new Test('猫猫',98);   //通过构造函数创建对象,必须使用new运算符
  console.log(obj.showInfo());