1、DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

document.documentElement     返回文档的根节点<html> 
document.body     <body> 
document.activeElement 返回当前文档中被击活的标签节点(ie) 
event.fromElement        返回鼠标移出的源节点(ie) 
event.toElement       返回鼠标移入的源节点(ie) 
event.srcElement     返回激活事件的源节点(ie) 
event.target         返回激活事件的源节点(firefox) 
当前对象为node 
返回父节点:node.parentNode, node.parendElement, 
返回所有子节点:node.childNodes(包含文本节点及标签节点),node.children 
返回第一个子节点:node.firstChild 
返回最后一个子节点: node.lastChild 
返回同属上一个子节点:node.nextSibling 
返回同属下一个子节点:node.previousSibling 
parentNode和parentElement功能一样,childNodes和children功能一样。但是parentNode和childNodes是符合W3C标准的,可以说比较通用。而另外两个只是IE支持,不是标准,Firefox就不支持 ,所以大家只要记得有parentElement和children就行了 

2、DOM操作——怎样添加、移除、移动、复制、创建和查找节点。

(1)创建新节点

createDocumentFragment()    //创建一个DOM片段

createElement()   //创建一个具体的元素

createTextNode()   //创建一个文本节点

(2)添加、移除、替换、插入

appendChild()

removeChild()

replaceChild()

insertBefore()

(3)查找

getElementsByTagName()    //通过标签名称

getElementsByName()    //通过元素的Name属性的值

getElementById()    //通过元素Id,唯一性

3、事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。

(1)冒泡型事件:事件按照从最特定的事件目标到最不特定的事件目标(document对象)的顺序触发。

IE 5.5: div -> body -> document

IE 6.0: div -> body -> html -> document

Mozilla 1.0: div -> body -> html -> document -> window

(2)捕获型事件(event capturing):事件从最不精确的对象(document 对象)开始触发,然后到最精确(也可以在窗口级别捕获事件,不过必须由开发人员特别指定)。

(3)DOM事件流:同时支持两种事件模型:捕获型事件和冒泡型事件,但是,捕获型事件先发生。两种事件流会触及DOM中的所有对象,从document对象开始,也在document对象结束。

DOM事件模型最独特的性质是,文本节点也触发事件(在IE中不会)。

4、XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。

XMLHttpRequest 对象提供了在网页加载后与服务器进行通信的方法。

<script type="text/javascript">
    varxmlhttp;
    functionloadXMLDoc(url){
        xmlhttp=null;
        if(window.XMLHttpRequest){    //code for all new browsers
            xmlhttp=newXMLHttpRequest();
        }elseif(window.ActiveXObject){    //code for IE5 and IE6
            xmlhttp=newActiveXObject("Microsoft.XMLHTTP");
        }
        if(xmlhttp!=null){
            xmlhttp.onreadystatechange=state_Change;
               xmlhttp.open("GET",url,true);
            xmlhttp.send(null);
        }else{
            alert("Your browser does not support XMLHTTP.");
        }
}

functionstate_Change(){
    if(xmlhttp.readyState==4){    //4 = "loaded"
        if(xmlhttp.status==200){    //200 = OK
            //...our code here...
        }else{
            alert("Problem retrieving XML data");
        }
    }
}
</script>

5、严格模式与混杂模式——如何触发这两种模式,区分它们有何意义。

在标准模式中,浏览器根据规范呈现页面;

在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。

浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法。如果XHTML文档包含形式完整的DOCTYPE,那么它一般以标准模式呈现。对于HTML 4.01文档,包含严格DTD的DOCTYPE常常导致页面以标准模式呈现。包含过渡DTD和URI的DOCTYPE也导致页面以标准模式呈现,但是有过渡DTD而没有URI会导致页面以混杂模式呈现。DOCTYPE不存在或形式不正确会导致HTML和XHTML文档以混杂模式呈现。

6、盒模型——外边距、内边距和边框之间的关系,IE 8以下版本的浏览器中的盒模型有什么不同。

一个元素盒模型的层次从内到外分别为:内边距、边框和外边距

IE8以下浏览器的盒模型中定义的元素的宽高不包括内边距和边框

 

7、块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。

块级元素,用CSS中的display:inline;属性则变为行内元素

行内元素,用CSS中的display:block;属性则变为块级元素

影响:周围元素显示在同一行或换行显示,根据具体情况调整样式


8、浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。

需要浮动的元素可使用CSS中float属性来定义元素的浮动位置,left:往左浮动,right:往右浮动

浮动元素引起的问题:

(1)父元素的高度无法被撑开,影响与父元素同级的元素

(2)与浮动元素同级的非浮动元素会跟随其后

(3)若非第一个元素浮动,则该元素之前的元素也需要浮动,否则会影响页面显示的结构

解决方法:

使用CSS中的clear:both;属性来清除元素的浮动可解决2、3问题,对于问题1,添加如下样式,给父元素添加clearfix样式:

.clearfix:after{content: ".";display: block;height: 0;clear: both;visibility: hidden;}

.clearfix{display: inline-block;}  /* for IE/Mac */


9、HTML与XHTML——二者有什么区别,你觉得应该使用哪一个并说出理由。

主要区别:

XHTML 元素必须被正确地嵌套

XHTML 元素必须被关闭,空标签也必须被关闭,如 <br> 必须写成 <br />

XHTML 标签名必须用小写字母

XHTML 文档必须拥有根元素

XHTML 文档要求给所有属性赋一个值

XHTML 要求所有的属性必须用引号""括起来

XHTML 文档需要把所有 < 、>、& 等特殊符号用编码表示

XHTML 文档不要在注释内容中使“--”

XHTML 图片必须有说明文字

XHTML 文档中用id属性代替name属性

详细了解:

HTML与XHTML的区别

10、JSON——它是什么、为什么应该使用它、到底该怎么使用它,说出实现细节来。

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式。易于人阅读和编写。同时也易于机器解析和生成。

JSON建构于两种结构:
“名称/值”对的集合(A collection of name/value pairs)。不同的语言中,它被理解为对象(object),纪录(record),结构(struct),字典(dictionary),哈希表(hash table),有键列表(keyed list),或者关联数组 (associative array)。 
值的有序列表(An ordered list of values)。在大部分语言中,它被理解为数组(array)。

转载于:https://www.cnblogs.com/amazinghtml/archive/2013/03/11/2954853.html

web前端开发工程师“想都不用想”的几个知识点相关推荐

  1. Web前端开发工程师必备技术列表

    WEB标准,Web前端开发工程师必备技术列表 想要打造并拥有一流的Web产品开发团队,在团队成员基础能力上一定要下功夫.对于Web前端产品开发来说,仅仅掌握Web1.0时代简单的"网页套接& ...

  2. 想成为一个Web前端开发工程师,需要掌握哪些知识?

    前端工程师已经成为目前互联网企业极具竞争力的人才,为了招聘到优秀的Web前端开发工程师,企业不断的提升薪资水平.因此,有越来越多的人加入到了学习Web前端行列.那么,想成为一名web前端开发工程师需要 ...

  3. 想成为一个Web前端开发工程师,需要掌握的详细知识总结

    前端工程师已经成为目前互联网企业极具竞争力的人才,企业不断提升薪资水平为了招聘到优秀的Web前端开发工程师.因此,越来越多的人想要学习Web前端.那么呢?Web前端的学习路线是什么? 想成为一个Web ...

  4. Web前端开发工程师--面试要求

    基本知识 下面我列出一些基本的知识点,这些都是我认为一名前端工程师(无论工作年头长短)在没有任何外来帮助的情况应该知道的. DOM结构--两个节点之间可能存在哪些关系以及如何在节点之间任意移动. DO ...

  5. 25个Web前端开发工程师必看的国外大牛和酷站

    逛了一周国外大牛们的博客与酷站,真是满满的钦佩.震撼.羡慕.惊喜---- Web设计是一个不断变化的领域,因此掌握最新的发展趋势及技术动向对设计师来说非常重要.无论是学习新技术,还是寻找免费资源与工具 ...

  6. 如何学习才能成为优秀的Web前端开发工程师?

    随着Web前端技术的广泛应用,Web前端开发工程师也成为了热门的岗位之一,并且吸引了很多人想要转行成为Web前端开发工程师.那么如何学习才能成为Web前端开发工程师呢? 如何学习才能成为优秀的Web前 ...

  7. 成都web前端开发工程师

    Web前端工程师的走红,可以说是意料之外情理之中,近几年来大家对于前端开发这一职位的褒奖不绝如缕,但是16年之后的前端开发招聘市场逐渐回归理性,前端进入了大浪淘沙的"换血"时代,想 ...

  8. 一名优秀的Web前端开发工程师的成长之路:如何学习前端开发知识以及书籍推荐

    我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀.甚至卓越的WEB前端工程师. 何为:前端工程师? 前端工程师 ...

  9. Web前端开发工程师实战培训教程

    Web前端开发工程师实战培训教程 现在Web前端开发的工作需求量很大,很多企业都专门去招聘Web前端的开发人员,待遇都是轻松过万的 我推荐给你们一套系统性学习Web前端开发的课程,可以完整的学习Web ...

  10. 怎样成长为一个优秀的 Web 前端开发工程师?

    链接:http://www.zhihu.com/question/19554845/answer/16755476 来源:知乎 首先,优秀的Web前端开发工程师要在知识体系上既要有广度和深度!做到这两 ...

最新文章

  1. The following packages have been kept back
  2. HD2094_产生冠军
  3. python抽象类的实现_python 抽象类、抽象方法的实现
  4. Camera360与全球1.8亿用户共同创造更美的照片
  5. c语言兔子洞,数据结构水题选讲 - osc_y08db3kb的个人空间 - OSCHINA - 中文开源技术交流社区...
  6. 手把手带你手写SpringMVC,剑指优秀开源框架灵魂
  7. 也拿baidu搜索开玩笑!
  8. OpenCV-巴特沃斯低通高通滤波器(C++)
  9. 1、配置后台登录以及模板引入
  10. DataNucleus之JDO操作演示样例
  11. coolfire的八篇入门文章(.txt)
  12. python获取百度迁徙大数据
  13. 电子面单平台JAVA对接方案
  14. chrome谷歌浏览器 离线安装包下载64位
  15. Code.V光学设计学习(一)——入门介绍
  16. 计算机中的随机存储器和只读存储器是什么,只读存储器和随机存储器的主要区别是什么...
  17. 香槟分校计算机研究生专业,伊利诺伊大学香槟分校计算机专业排名好不好?
  18. Python自动化 requests 库:发送 form-data 格式的 http 请求
  19. 漫谈程序员系列:看看你离优秀有多远
  20. 知物由学 | 一文读懂Android资源文件保护

热门文章

  1. php顺序查找法,php二分查找、顺序查找算法
  2. 那些让老板赞不绝口的可视化大屏,附模板和教程
  3. flutter listview 滚动到底部_Flutter系列之Flex布局详解
  4. 输入6个学生的5门成绩c语言数组,C语言数组指针的小例子.pdf
  5. linux java php_Linux PHP 搭建 JavaBridge
  6. Python图片转html字符画
  7. 编程实现 带符号加法溢出判断
  8. 目标检测——对数据进行EDA分析的学习笔记
  9. 由m种数字组成的n位数有多少个
  10. [转]nonlocal和global