1、CSS引入的方式有哪些?

1）外联：<link>标签
CSS代码保存在扩展名为.css的样式表中
HTML文件引用扩展名为.css的样式表，有两种方式：链接式、导入式。

  <!--3.外部样式表 链接式-->
    <!--    <link type="text/css" rel="styleSheet"  href="index.css" />-->
    <!--3.外部样式表 导入式-->
    <style type="text/css">
        @import url("index.css");
    </style>

2）内联：<style>标签

  <!--2.使用内部样式表引入CSS-->
    <style type="text/css">
        div{
            background: green;
        }
    </style>

3）元素内嵌：元素的style属性

<!--1.行内样式 使用style属性引入CSS样式-->
<h1 style="color:red;">style属性的应用</h1>
<p  style="font-size:14px;color:green;">直接在HTML标签中设置的样式</p>

2、CSS选择符有哪些?

• id选择器（#myid）;
• 类选择器（.myclassname）;
• 标签选择器（div,h1,p）;
• 子选择器（ul>li）;
• 后代选择器（li a）;

3、你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核) 火狐（Gecko） 谷歌（webkit） opear(Presto)

4、”==”和“===”的不同

双等：会自动转换数据类型。
三等（全等）：不会转换；全等是先判断左右两边的数据类型，如果数据类型不一致，则直接返回false，之后才会进行两边值的判断。

5、$(this) 和 this 关键字在 jQuery 中有何不同？

前者是jQuery对象，使用jQuery方法和属性；后者是JavaScript对象，使用JavaScript方法和属性。

    //返回window对象
    console.log(this)
    //返回jquery对象
    console.log($(this))

6、jQuery 里的 each() 是什么函数？你是如何使用它的？

each() 函数就像是 Java 里的一个 Iterator，它允许你遍历一个元素集合。你可以传一个函数给 each() 方法，被调用的 jQuery 对象会在其每个元素上执行传入的函数。

body:

<ul>
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
</ul>
<button id="myButton">点我</button>

script:

    $("#myButton").click(function(){
        $("li").each(function(){
            alert($(this).text())
        });
    });

7、 ready() 是个什么函数？为什么要用它？

ready() 函数用于在文档进入ready状态时执行代码。当DOM 完全加载（例如HTML被完全解析DOM树构建完成时），jQuery允许你执行代码。

1）第一种：

$(document).ready(function(){

});

$(document)把原生的document这个dom对象转换为JQuery对象，转换完成后才能调用ready方法。

ready(fn)表示的是页面结构被加载完毕后执行传入函数fn

2）第二种：

$(function(){

});

当页面加载完毕后执行里面的函数。这一种相对简单，用的最多。

3）window.onload的区别

JQuery中的页面加载完毕事件，表示页面结构被加载完毕；

window.onload表示的是页面被加载完毕；必须等页面中的图片、声音、图像等远程资源被加载完毕后才调用而JQuery中只需要页面架构加载完毕

演示代码:

  <script>
        //如果把ready去掉，放在head中，是无法注册事件的
        $(document).ready(function (){
            //在dom都加载完之后，绑定事件
            $("#myButton").click(function(){
                $("li").each(function(){
                    alert($(this).text())
                });
            });
        })
    </script>

8、网页上有 5 个 <div> 元素，如何使用 jQuery来选择它们？

jQuery 代码：$("div")，这样会返回一个包含所有 5 个 div 标签的 jQuery 对象。

9、列举常用的几种jQuery选择器

jQuery 元素选择器

jQuery 使用 CSS 选择器来选取 HTML 元素。

$("p")选取 <p> 元素。

$("p.intro") 选取所有 class="intro" 的 <p> 元素。

$("p#demo") 选取所有 id="demo" 的 <p> 元素。

jQuery 属性选择器

jQuery 使用 XPath 表达式来选择带有给定属性的元素。

$("[href]") 选取所有带有 href 属性的元素。

$("[href='#']") 选取所有带有 href 值等于 "#" 的元素。

$("[href!='#']") 选取所有带有 href 值不等于 "#" 的元素。

$("[href$='.jpg']") 选取所有 href 值以 ".jpg" 结尾的元素。

jQuery CSS 选择器

jQuery CSS 选择器可用于改变 HTML 元素的 CSS 属性。

下面的例子把所有 p 元素的背景颜色更改为红色：

$("p").css("background-color","red");

其他选择器

$(this) 当前 HTML 元素
$("p")  所有 <p> 元素
$("p.intro")    所有 class="intro" 的 <p> 元素
$(".intro") 所有 class="intro" 的元素
$("#intro") id="intro" 的元素
$("ul li:first")    每个 <ul> 的第一个 <li> 元素
$("[href$='.jpg']") 所有带有以 ".jpg" 结尾的属性值的 href 属性
$("div#intro .head")    id="intro" 的 <div> 元素中的所有 class="head" 的元素

10、AJAX应用和传统Web应用有什么不同？

在传统的Javascript编程中，如果想得到服务器端数据库或文件上的信息，或者发送客户端信息到服务器，需要建立一个HTML form然后GET或者POST数据到服务器端。用户需要点击”Submit”按钮来发送或者接受数据信息，然后等待服务器响应请求，页面重新加载。因为服务器每次都会返回一个新的页面， 所以传统的web应用有可能很慢而且用户交互不友好。使用AJAX技术， 就可以使Javascript通过XMLHttpRequest对象直接与服务器进行交互。通过HTTP Request， 一个web页面可以发送一个请求到web服务器并且接受web服务器返回的信息(不用重新加载页面)，展示给用户的还是同一个页面，用户感觉不到页面刷新，也看不到到Javascript后台进行的发送请求和接受响应。

11、AJAX的全称是什么？ 介绍一下AJAX

AJAX的全称是Asynchronous JavaScript And XML（异步的JavaScript和XML）.。AJAX是2005年由Google发起并流行起来的编程方法， AJAX不是一个新的编程语言，但是它是一个使用已有标准的新的编程技术。使用AJAX可以创建更好，更快，更用户界面友好的Web应用。AJAX技术基于Javascript和HTTP Request。

13、AJAX的优缺点都有什么？

• 优点：

1）最大的一点是页面无刷新，用户的体验非常好。

2）使用异步方式与服务器通信，具有更加迅速的响应能力。

3）ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。

4）基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

• 缺点：

1）不支持浏览器back按钮。

2）安全问题 AJAX暴露了与服务器交互的细节。

3）对搜索引擎的支持比较弱。

4）破坏了程序的异常机制。

5）不容易调试。

14、简述Ajax的工作原理？

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。在创建Web站点时，在客户端执行屏幕更新为用户提供了很大的灵活性。

15、请介绍一下XmlHttpRequest对象

Ajax的核心是JavaScript对象XmlHttpRequest。该对象在Internet Explorer 5中首次引入，它是一种支持异步请求的技术。简而言之，XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。通过XMLHttpRequest对象，Web开发人员可以在页面加载以后进行页面的局部更新。

jquery中实现ajax:

   $(document).ready(function (){
            //在dom都加载完之后，绑定事件
            $("#myButton").click(function(){
                $.ajax({ url: "test.html", context: document.body, success: function(data){
                        console.log(data)
                    }});
            });
        })

16.简单说一下HTML，CSS，javaScript在网页开发中的定位？

HTML：超文本标记语言，定义网页的结构

CSS：层叠样式表，用来美化页面

JavaScript：主要用来验证表单，做动态交互(其中AJAX发送异步请求)

17.JS和JQuery的关系

JQuery是一个JS框架，封装了JS的属性和方法，并且增强了JS的功能，让用户使用起来更加方便。原来使用js是要处理很多兼容性的问题(注册事件)，由于Jquery封装了底层，就不用处理兼容性问题(注册事件等)。原生的js的dom和事件绑定Ajax等操作非常麻烦，JQuery等装以后非常方便。

18.JQuery的AJAX和原生js实现有什么关系

JQuery中的AJAX也是通过原生的js封装的,封装完成后让我们使用更加便利，不用考虑底层实现和兼容性等处理。如果采用原生js实现AJAX是非常麻烦的，并且每次都是一样的，如果我们不使用JQuery，我们也要封装ajax对象的方法和属性，有像jquery这些已经封装完成，并且经过很多企业实际的框架，比较可靠并且开源，我们就不需要等装，直接使用成熟的框架(jquery)即可。

19.简单说一下html5？你对哪些现在哪些新技术有了解

html5是最新版本的html，是在原来html4的基础上增强类一些标签。

html5增加了一些像画板、声音、视频、web存储方面等高级功能，但是html5有一个不好的地方，那就是html5太强调语义了，导致开发者都不知道要选择哪个标签。在页面布局时，无论头部、主体、导航等模块都使用div来表示，但是html5的规范，需要使用不同不同的标签。(header,footer)

https://www.w3school.com.cn/html5/html5_reference.asp

20.简单说一下css3。

css3是最新版本的css，是对原来的css2的功能增强

css3中提供一些css2中实现起来比较困难或者不能实现的功能。

1）盒子圆角边框

2）盒子和文字的阴影

3）渐变

4）装换、移动、缩放、旋转等

5）过渡、动画都可以使用动画

6）可以使用媒体查询实现响应式网站

css3最大的缺点就是要根据不同的浏览器处理兼容性，对应有一些处理兼容性的工具。
https://www.runoob.com/css3/css3-tutorial.html

21.bootstrap是什么

bootstrap是一个移动设备优先的UI框架，我们可以不用写任何css、js代码就能实现比较漂亮的有交互性的页面，我们程序员对页面的编写是有硬伤的，所有要自己写页面的话就要使用类似于bootstrap这样的UI框架

平时用的很多：

1）模态框

2）表单、表单项

3）布局

4）删格系统

22.请描述一下cookie，sessionStorage和localStorage的区别？

cookies兼容所有的浏览器，Html5提供的storage存储方式。

• Document.cookie

• Window.localstorage

• Window.sessionstorage

cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。

存储大小限制也不同，cookie数据不能超过4k，同时因为每次http请求都会携带cookie，所以cookie只适合保存很小的数据，如会话标识。sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。

数据有效期不同，sessionStorage：仅在当前浏览器窗口关闭前有效，自然也就不可能持久保持；localStorage：始终有效，窗口或浏览器关闭也一直保存，因此用作持久数据；cookie只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。

作用域不同，sessionStorage不在不同的浏览器窗口中共享，即使是同一个页面；localStorage 在所有同源窗口中都是共享的；cookie也是在所有同源窗口中都是共享的。