zoukankan      html  css  js  c++  java
  • 第二篇

    1.伪类与伪元素的区别?

    1)定义区别

      伪类:伪类用于选择DOM树之外的信息,或是不能用简单选择器进行表示的信息。前者包含那些匹配指定状态的元素,比如

    :visited,:active;后者包含那些满足一定逻辑条件的DOM树中的元素,比如:firstr-child, :first-of-type,:target

      伪元素:伪元素伪DOM树没有定义的虚拟元素。不同于其他选择器,它不以元素为最小选择单位,它选择的是元素指定内容,比如

    ::before表示选择元素内容的之前内容。

    2)语法区别

      在CSS3中,伪类与伪元素在语法上也有区别,伪元素修改以::开头

    3)伪类/伪元素一览表

    【1】伪类

    :active =>选择正在被激活的元素

    :hover => 选择被鼠标悬浮着的元素

    :link => 选择未被访问的元素

    :visited => 选择已被访问的元素

    :first-child => 选择满足是其父元素的第一个子元素的元素

    :lang => 选择带有指定lang属性的元素

    :focus => 选择拥有键盘输入焦点的元素

    :enable => 选择每个已启动的元素

    :disable => 选择每个已禁止的元素

    :checked => 选择每个被选中的元素

    :target => 选择当前的锚点元素

    【2】伪元素如下:

    ::first-letter => 选择指定元素的第一个单词

    ::first-line => 选择指定元素的第一行

    ::after => 在指定元素的内容后面插入内容

    ::before => 在指定元素的内容前面插入内容

    ::selection => 选择指定元素中被用户选中的内容

    2.css样式优先级,各自的权重

    优先级:

    important > 内联样式 > ID选择器 >伪类、属性选择器、类选择器>元素(类型)选择器>通用选择器(*)

    权重:

    1.第一等:代表内联样式,如:style="",权值为1000。

    2.第二等:代表ID选择器,如:#content,权值为100。

    3.第三等:代表伪类和属性选择器,如.content,权值为10

    4.第四等:代表类型选择器和伪元素选择器,如div p,权值为1。

    3.常见的DOM操作有哪些?

    主要操作包括:查找节点、新建节点、添加节点、删除节点、修改节点;

    1)DOM常用操作举例

    // 查找节点
    
    document.getElementById('id属性值'); //返回拥有指定id的第一个对象的引用
    
    document.getElementByClassName('class属性值');// 返回拥有指定class的对象集合

    2)新建节点:

    // 创建新的元素节点
    
    document.createElement('元素名');
    
    // 创建新的属性节点
    
    document.createAttribute('属性名');
    
    var h1 = document.getElementsByTagName("H1")[0];
    
    var att = document.createAttribute("class");
    
    att.value = "democlass";
    
    h1.setAttributeNode(att);
    
    // 创建新的文本节点
    
    document.createTextNode('文本内容');
    
    var t = document.createTextNode("Hello World");
    
    document.body.appendChild(t);
    
    // 创建新的注释节点
    
    document.createComment('注释节点');

    3)添加节点

    var element = document.getElementsByTagName('p')[0];
    
    element.innerHTML = ‘新增文本内容’; //插入文本内容
    

    4)删除节点

    parentNode.removeChild( existingChild ); // 删除已有的子节点,返回值为删除节点
    
    element.removeAttribute( ' 属性名' ); // 删除具有指定属性名称的属性,无返回值
    
    element.removeAttributeNode( attrNode ); // 删除指定属性,返回值为删除的属性
    
    // Given:<div id="top" align="center" />
    
    var d = document.getElementById("top");
    
    var d_align = d.getAttributeNode("align");
    
    d.removeAttributeNode(d_align);
    
    // align is now removed: <div id="top" />
    

    5)修改节点

    // 添加属性节点,修改属性值

    element.setAttribute( attributeName, attributeValue );

    6) 属性节点

    // 增添id属性,并修改class属性值
    var element = document.getElementsByTagName('p')[0];
    
    // 添加属性节点
    var attr = document.createAttribute('id');
    attr.value = 'idValue';
    element.setAttributeNode(attr);
    
    // 修改属性值
    var attr = document.createAttribute('class');
    attr.value = 'classNewValue';
    element.setAttributeNode(attr);
    

    7)DOM事件

    允许JavaScript对HTML事件作出反应,主要包括

    onclick => 当用户点击时

    onload => 用户进入

    onmouseover => 鼠标移入

    onmouseout => 鼠标移出

    onmousedown => 鼠标按下

    onmouseup => 鼠标抬起

    8)判断数据类型有哪些方法?

    1)typeof

      typeof是一个操作符,其右侧跟一个一元表达式,并返回这个表达式的数据类型。返回的结果用该类型的字符串(全小写字母)形式表示

    ,包括以下7种:number、boolean、symbol、string、object、undefined、function等。

    2)instanceof

      instanceof是用来判断A是否为B的实例,表达式为:A instanceof B,如果A是B的实例,则返回true。否则返回false。在这里需要特别注意的是

    :instanceof检测的是原型

    3)constructor

      当一个函数F被定义时,JS引擎会为F添加prototype原型,然后再在prototype上添加一个constructor属性,并让其指向F的引用。

    4)toString

    toString() 是 Object 的原型方法,调用该方法,默认返回当前对象的 [[Class]]点击并拖拽以移动 。这是一个内部属性,其格式为 [object Xxx] ,其中 Xxx 就是对象的类型。对于 Object 对象,直接调用 toString()  就能返回 [object Object] 。而对于其他对象,则需要通过 call / apply 来调用才能返回正确的类型信息。

    5.介绍一下JS的基本数据类型

    Undefined、Null、Boolean、Number、String

    6.介绍一下JS有哪些内置对象?

    Object是JavaScript中所有对象的父对象

    数据封装类对象:Object、Array、Boolean、Number、String

    其他对象:Function、Argument、Math、Date、RegExp、Error

    7.push()-pop()-shift()-unshift()分别是什么功能?

    // push 方法
    // 将新元素添加到一个数组中,并返回数组的新长度值
    var a = [1,2,3,4];
    a.push(5);
    
    // pop 方法
    // 移除数组中的最后一个元素并返回该元素
    var a = [1,2,3,4];
    a.pop();
    
    // shift 方法
    // 移除数组中的第一个元素并返回该元素
    var a = [1,2];
    a.shift();
    
    // unshift 方法
    // 将指定的元素插入数组开始位置并返回该数组的长度
    var a = [1,2];
    a.unshift(0);

    8.null和undefined有何却别?

    1)null 表示一个对象被定义了,值为“空值”;undefined表示不存在这个值。

    2)undfined:是一个表示“无”的原始值或者说表示“缺少值”,就是此处应该有一个值,但是还没有定义。当尝试读取时会返回undfined;例如变量被声明了,但没有赋值

    ,就等于undefined。

    3)注意:在验证null时,一定要使用 ===,因为 == 无法分别null和undefined

    9.new操作符具体干了什么?

    (1)创建一个新对象;

    (2)将构造函数的作用域赋给新对象(因此this就指向了这个新对象);

    (3)执行构造函数中的代码(为这个新对象添加属性);

    (4)返回新对象

    10.你对JSON了解吗?

    1)JSON(JavaScript Object Notation)是一种轻量级的数据交换格式。

    2)它是基于JavaScript的一个子集对象。数据格式简单,易于读写,占用宽带小。

    3)2个API。JSON.parse()  => 将对象转换成字符串。JSON.stringify()   => 将字符串转换成对象。

      转自:http://www.itlike.com/article

  • 相关阅读:
    (五)串口通讯方式设置
    (四)计算机上电自启动
    (三)磁盘分区
    (一)老毛桃U盘启动盘制作
    (二)操作系统安装
    计算机常见问题1:计算机网口问题
    Java日志打印方法
    MySQL数据库常见问题1:关于 “ MySQL Installer is running in Community mode ” 的解决办法
    窥见云技术未来大势,腾讯云Techo开发者大会即将在京召开
    揭秘国庆阅兵直播背后的黑科技,腾讯云提供技术支持
  • 原文地址:https://www.cnblogs.com/huen2015/p/10532041.html
Copyright © 2011-2022 走看看