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

  • 相关阅读:
    UVA
    UVA
    模板——扩展欧几里得算法(求ax+by=gcd的解)
    UVA
    模板——2.2 素数筛选和合数分解
    模板——素数筛选
    Educational Codeforces Round 46 (Rated for Div. 2)
    Educational Codeforces Round 46 (Rated for Div. 2) E. We Need More Bosses
    Educational Codeforces Round 46 (Rated for Div. 2) D. Yet Another Problem On a Subsequence
    Educational Codeforces Round 46 (Rated for Div. 2) C. Covered Points Count
  • 原文地址:https://www.cnblogs.com/huen2015/p/10532041.html
Copyright © 2011-2022 走看看