




已阅读5页,还剩74页未读, 继续免费阅读
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
什么是ajax:AJAX是“AsynchronousJavaScriptandXML”的缩写。他是指一种创建交互式网页应用的网页开发技术。类似于DHTML或LAMP,AJAX不是指一种单一的技术,而是有机地利用了一系列相关的技术。事实上,一些基于AJAX的“派生/合成”式(derivative/composite)的技术正在出现,如“AFLAX”。AJAX的应用使用支持以上技术的web浏览器作为运行平台。这些浏览器目前包括:Mozilla、Firefox、InternetExplorer、Opera、Konqueror及Safari。但是Opera不支持XSL格式对象,也不支持XSLT。Ajax包含下列技术:基于web标准(standards-basedpresentation)XHTML+CSS的表示;使用DOM(DocumentObjectModel)进行动态显示及交互;使用XML和XSLT进行数据交换及相关操作;使用XMLHttpRequest进行异步数据查询、检索;使用JavaScript将所有的东西绑定在一起。为什么要用ajax:Ajax应用程序的优势在于:1.通过异步模式,提升了用户体验2.优化了浏览器和服务器之间的传输,减少不必要的数据往返,减少了带宽占用3.Ajax引擎在客户端运行,承担了一部分本来由服务器承担的工作,从而减少了大用户量下的服务器负载。AJAX的最大的特点是什么。Ajax可以实现动态不刷新(局部刷新)就是能在不更新整个页面的前提下维护数据。这使得Web应用程序更为迅捷地回应用户动作,并避免了在网络上发送那些没有改变过的信息。XMLHTTPREQUEST对象Ajax的核心是JavaScript对象XmlHttpRequest。该对象在InternetExplorer5中首次引入,它是一种支持异步请求的技术。简而言之,XmlHttpRequest使您可以使用JavaScript向服务器提出请求并处理响应,而不阻塞用户。通过XMLHttpRequest对象,Web开发人员可以在页面加载以后进行页面的局部更新。AJAX技术体系的组成部分有哪些?HTML,css,dom,xml,xmlHttpRequest,javascriptAJAX应用和传统WEB应用有什么不同?在传统的Javascript编程中,如果想得到服务器端数据库或文件上的信息,或者发送客户端信息到服务器,需要建立一个HTMLform然后GET或者POST数据到服务器端。用户需要点击”Submit”按钮来发送或者接受数据信息,然后等待服务器响应请求,页面重新加载。因为服务器每次都会返回一个新的页面,所以传统的web应用有可能很慢而且用户交互不友好。使用AJAX技术,就可以使Javascript通过XMLHttpRequest对象直接与服务器进行交互。通过HTTPRequest,一个web页面可以发送一个请求到web服务器并且接受web服务器返回的信息(不用重新加载页面),展示给用户的还是同一个页面,用户感觉不到页面刷新,也看不到到Javascript后台进行的发送请求和接受响应。AJAX请求总共有多少种CALLBACKAjax请求总共有八种CallbackonSuccessonFailureonUninitializedonLoadingonLoadedonInteractiveonCompleteonExceptionAJAX和JAVASCRIPT的区别?javascript是一种在浏览器端执行的脚本语言,Ajax是一种创建交互式网页应用的开发技术,它是利用了一系列相关的技术其中就包括javascript。Javascript是由网景公司开发的一种脚本语言,它和sun公司的java语言是没有任何关系的,它们相似的名称只是一种行销策略。在一般的web开发中,javascript是在浏览器端执行的,我们可以用javascript控制浏览器的行为和内容。在Ajax应用中信息是如何在浏览器和服务器之间传递的:通过XML数据或者字符串在浏览器端如何得到服务器端响应的XML数据?XMLHttpRequest对象的responseXMl属性XmlHttpRequest对象在IE和FF中创建方式有没有不同?IE中通过NewActiveObject()得到,FF中通过New XmlHttpRequest ()得到.介绍一下XmlHttpRequest对象的常用方法和属性(回答的越多越好)open(“method”,”URL”)建立对服务器的调用,第一个参数是HTTP请求方式可以为GET,POST或任何服务器所支持的您想调用的方式。第二个参数是请求页面的URL。send()方法,发送具体请求abort()方法,停止当前请求readyState属性请求的状态有5个可取值0=未初始化,1=正在加载2=已加载,3=交互中,4=完成responseText属性服务器的响应,表示为一个串reponseXML属性服务器的响应,表示为XMLstatus服务器的HTTP状态码,200对应ok400对应notfound什么是XMLXML是扩展标记语言,能够用一系列简单的标记描述数据XML的解析方式常用的用dom解析和sax解析。dom解析是一次性读取xml文件并将其构造为DOM对象供程序使用,优点是操作方便,但是比较耗内存。Sax是按事件驱动的方式解析的,占用内存少,但是编程复杂。你采用的是什么框架(架包)?这题是必问的,一般也是最开始就会问到。在java中比较流行的有dojo,Prototype,JQuery,Dwr,extjs等等如果熟悉某种AJAX框架,他可能会问到怎样在程序中使用这种框架DWR框架介绍nDWR(DirectWebRemoting)是一个WEB远程调用框架.利用这个框架可以让AJAX开发变得很简单.利用DWR可以在客户端利用JavaScript直接调用服务端的Java方法并返回值给JavaScript就好像直接本地客户端调用一样(DWR根据Java类来动态生成JavaScrip代码).nDWR的实现原理是通过反射,将java翻译成javascript,然后利用回调机制,从而实现了javascript调用Java代码介绍一下PROTOTYPE的$()函数,$F()函数,$A()函数都是什么作用?$()方法是在DOM中使用过于频繁的document.getElementById()方法的一个便利的简写,就像这个DOM方法一样,这个方法返回参数传入的id的那个元素。$F()函数是另一个大受欢迎的“快捷键”,它能用于返回任何表单输入控件的值,比如textbox,drop-downlist。这个方法也能用元素id或元素本身做为参数。$A()函数能把它接收到的单个的参数转换成一个Array对象。Ajax优点:1、页面无刷新,用户的体验非常好。2、使用异步方式与服务器通信,具有更加迅速的响应能力。3、可以把以前一些服务器负担的工作转嫁到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,ajax的原则是“按需取数据”,可以最大程度的减少冗余请求,和响应对服务器造成的负担。4、基于标准化的并被广泛支持的技术,不需要下载插件或者小程序。ajax的缺点:1、ajax不支持浏览器back按钮。2、安全问题AJAX暴露了与服务器交互的细节。3、对搜索引擎的支持比较弱。4、破坏了程序的异常机制。5、不容易调试。浅谈CSS布局从网页表现来看,HTML是实体本身,要实现各种优雅的布局的需要依赖CSSHTML元素两大类型为块级元素与行内元素,网页的布局一般由块级元素组织,元素不同便有不一样的表现要实现布局就要用到与布局有关的CSS属性为position,常用属性为static、absoulute、fixed、relativeposition的作用是改变元素的状态,由文档流转为相对文档流或者脱离文档流元素(定位元素)当然float也能引发块级元素脱离文档流,但是其表现与原理与上面不一致,而且要慎用float布局于是这里便已经有三种“流”了,不同的布局元素会处于不同的“执行环境”,在“执行环境”中才能方便的对其进行管理这个管理的依据便是BFC(块级作用域上下文),根据我粗浅的理解是,BFC也就是浏览器提供的一块渲染区文档流的元素处于一个渲染区,而定位元素处于另一层渲染区,float元素又会与之不同各个渲染区中的元素具有其定位规则,最简单的便是文档流中的元素,遵循其块级元素独占一行+盒模型的规则: 块级元素独占一行,并且具有框(经典盒模型) 块级元素间由margin属性分割,并且垂直方向的margin会取其大者 块级元素必定左靠着父级块级元素左边框(包含块,布局上下文) float元素不能影响块级元素的BFC区域,但是其高度会参与计算创建BFC的方式有: float overflow display(使行内元素具有BFC) position基于此,我们便可以实现我们的布局了,这里以最简单的两列布局为例(左边导航,右边内容主体)由于先出现的DOM先展示,所以内容优先原则,我们会将主体dom先展示 * margin: 0; padding: 0; div border: 1px solid black; #sidebar position: absolute; left: 0; top: 0; width: 95px; #content margin-left: 100px; 主体 导航这里从理论上说,便是触发了siderbar元素的定位特性,其BFC与文档流不相关了。当然,这里siderbar可以使用float实现,但是float本身应该用于处理文字与图片包裹的需求,我们本着职责分离的想法就别那样干了。而且使用float还会引起元素坍塌,这里还要费劲去处理清除浮动行内元素行内元素的处理比较复杂,首先行内元素的高度由其line-height决定,所以不要妄想其设置一个行内元素的高度,这会引起意想不到的问题举一个例子来说,很多大型网站都会具有统计代码,而此类统计代码一般是以img做请求发出,这个时候可能会导致10px左右的白屏问题这个就是妄想设置行内元素高度的结果,独立的inline元素出现时,会为其创建一个line boxes作为容器(文字框)一行文字一个line Boxes,一行高度由其中最高的行内元素确定,上例中有一个height为0的img,却为其生成了一个高度为10的行高下面的代码中,div会被行内元素撑开,其高度会由span中line-height高者决定主体 导航 移动端的建议 移动端的文档流渲染效率最高,应该避免大范围使用定位元素,在小米,三星等低端下定位元素可能渲染不出来(解决方案是引起回流) img元素加载失败时候会有边框,需要搞掉 慎用fixed属性,fixed对于移动端来说有点头疼,首先会有文本聚焦fixed定位错乱问题,其次在ios4的屏幕中,如果加上浏览器上下工具条,再用fixed可视区域会变得很小 ios是按块渲染的,布局时候可以分块,不会渲染可视区域外的内容 动画或者border-radius、box-shadow等属性皆会使手机耗电加剧(但是这个好像与我们没关系) fixed元素为其设置html可能不响应或者说渲染看不见,常见于ipod或者低端android 当然能在布局上用上一些语义化标签自然是好事,这样对SEO或者特殊人事有一定帮助,比如strong、article之类的一次请求的完整流程一次URl输入后,其流程如下,首先是请求响应的流程:1 解析URL,解析域名生成唯一IP地址,开始搜索服务器2 找到服务器后,服务器接收请求被服务器进程拦截;一般而言,.net的程序会被IIS处理,java会被jBoss或者tomcat处理3 服务器处理请求,如果静态文件的话直接返回,若是.net或者java等动态脚本会经过服务器编译,执行其中的服务器端代码4 若是服务器端具有数据库操作的话,这里还需要与DB建立连接,操作数据库5 服务器处理结束后,生成最终的静态HTML字符串返回,开始向请求者(客户端)返回请求字符串,一次返回量过大就会分批次,这是一个优化点6 服务器响应到达浏览器,浏览器开始处理请求,进入浏览器解析流程请求返回后,便进入了我们关注的前端模块简单来说,浏览器会解析HTML生成DOM Tree,其次会根据CSS生成CSS Rule Tree,而javascript又可以根据DOM API操作DOM上面的文字描述的很简单,事实上发生的事情,却很复杂,这里与代码实现也很有关联,但是有几个关键点:页面一定会等所有的HTML结构与CSS加载下来才渲染(webkit内核)比如我们这里使用fiddler限制其外链加载,我们为其限速为10s div border: 1px solid black; a color: Red; 主体 导航 我们看到事实上62ms后页面整体dom结构就加载好了,这个时候我们是可以使用js操作dom结构的,但这里一个重点是:CSS外链加载会阻塞js的执行,并且重置CSS会引起浏览器的回流或者重绘,也就是:css外链会阻塞整个页面的渲染(显示),但是其DOM结构是可操作的,中间如果有阻塞性的操作,比如alert的话会强制浏览器绘制页面上面的特性与css外链的顺序无关,并且有几个样式相关的操作,便会执行几次,最终采用最近或者优先级最高的样式 div border: 1px solid black; a color: Red; 主体 导航 document.getElementById(span2).innerHTML = 测试; alert(1); alert(2) 一个需要注意的地方是,chrome与firefox或者IE表现不一致,firefox与IE都是先渲染页面最后等待CSS下来后再次渲染所以我们很多同学面试时说将css外链放到header中,而不是body中的理解都是一知半解,这里真实的处理办法是异步插入css外链才行。至少对于chrome需要做这个处理,否则页面就是出不来,因为多数手机是webkit内核,保不齐这里出多少事情。根据以上流程后,页面也基本出来了,这里简述其流程 生成DOM树 计算CSS样式(生成CSS Rule Tree) 构建render Tree reflow,定位元素位置与大小 绘制页面上面过程如果js操作dom或者中间有一段style都会引起reflow,由于img会在文档加载结束后加载,可能会撑开页面,导致回流,所以一般需要对img设置尺寸PS:事实上chrome获得请求时本身也有几个事件点,这里可以用其开发性能插件,但对前端基本透明,我们这里不关注了MVC与组件化View分离很多程序的变革集中积累在VIEW一块的处理,原因是这里的需求是最复杂的,就View分离来说,最成功的我觉得是ASP到ASP.net的变革最初的ASP程序,会将C#代码写在asp代码中,这样的结果便是页面里面既有html又有C#代码,甚至一个js循环中会嵌套出C#的循环PS:你一定要相信,那个时候不会有js分成的概念,因为需求达不到所谓的View分离便是,程序员确实受不了维护显示与逻辑同时处于一个页面的程序了,于是他选择了改变,改变的结果便是拆分View分离一大核心思维便是,分得开,合得拢,他们这里引入一个codebehind方案将一个页面文件分成两个(事实上是三个) index.apsx index.aspx.cspublic partial class _00综合_10doc_write_index : System.Web.UI.Page protected void Page_Load(object sender, EventArgs e) 最终这两个文件会和到一起,两个文件之间也可通信,而通信的桥梁是.net一个个被人诟病的组件,比如: button组件 datalist label组件 伟大的gridview各个组件在C#层面上会拥有一个ID进行约束,.cs文件便可以根据该ID为其注册各个事件,这个与javascript的模型便非常类似了View分离的第一个优点便是,用户的界面变得干净了,不会有代码混杂的现象,第二个优点便是业务端代码可以再分离,从而多了数据层、业务层等各个概念而组件的出现让.net变成了世界上开发最快的语言,这点谁也不可否认,而这些都是前端MVC出现或者组件出现的意义前端View分离与asp当初的情况一致,js进行dom操作或者字符串拼接的目的事实上就是想形成一个可供展示的View,前端jser已经再也不能忍受这种代码了:很多时候,我们想将对应的模板单独的放到一个地方,每次样式若是有更改,只需要更改那个文件即可,只要与之呼应的“ID”不丢失即可,比如这样的结构和代码: % for(var i = 0, len = btns.length; i div class=cui-flexbd 这样做的道理是,这个样子做到了表现与行为分离,我们分得开,然后会根据基类的一个机制,让他们最终合到一块,以完成功能这里我们依旧需要强调一个前提:“ID”关联不可丢失,否则“行为”将不可表现,只要两者间关联不丢,这里便可轻松满足以下逻辑: CSS名修改(非标识性CSS名) 标签改变 描述性文字改变MVC在前端重复性或者类似重复性的代码应该抽象为一个方法,在重复使用需要提示框需求后便会学会形成alert组件组件的出现是代码抽象,代码重用的标识,这个样子既可以减少工作量也可以减少代码容量,而组件的实现与MVC思维的很好诠释比如以下代码: 事实上,MVC的任意一块都可以作为单独的模块实现,比如会有这样的需求:一个model实例的变化会影响两个View的显示,但是仅仅对UI一块来说我们做了如下处理:核心点变成了几个属性: template,根据他生成UI datamodel,根据他生成viewModel提供给template使用 eventArr,业务事件注册点这个代码是Blade框架的UI基类,他是一个迷你MVC框架 propertys: function () /模板状态 this.template = ; this.datamodel = ; this.events = ; this.wrapper = $(body); this.id = _.uniqueId(ui-view-); /自定义事件,此处需要注意mask 绑定事件前后问题,考虑scroll.radio插件类型的mask应用,考虑组件通信 this.eventArr = ; /初始状态为实例化 this.status = init; /this.availableFn = function () template作为View的实现,datamodel作为model实现,我们会根据datamodel与template生成基本的view实体这里datamodel与template之间会有一个viewModel的映射关系,是为了防止服务器端突然将title变成Title而导致模板解析错误而整个文件便是一个控制器,view有的事件行为采用javascript委托技术全部注册在根元素上,如此整个UI就活了,他的好处是: 具有继承关系,可以拥有统一的资源释放,或者View通信机制代码量也会减少MVC与组件化的意义MVC对前端的意义甚大,因为jser对MVC或者分模块的思维的深入理解,我们才会将前端代码做分离,这样会有效的避免多人更改一个文件的难题。组件化是对重复工作,重复代码的降低,当然是好东西.资源加载前端优化的瓶颈始终在资源加载,只要加载快,无论你代码写的多慢(不要纠结死循环),都一定快,所以前端优化事实上一直都是一个主题:瘦身压缩css sprite延迟加载(主要针对图片)按需加载(主要针对首屏未用到的UI)缓存CDN托管预加载等词语不断的在前端出现,但是一个不可避免的事实是,需求越发复杂,体验要求越高,所以一个前端可能的事实是:前端资源体积越来越大,避免此事发生不是前端说了算的,需要产品与交互一起努力,清晰、体验好、轻量级的设计谁不喜欢,但是广告营销也不能不考虑,总之此事路还长!webapp的资源加载对于webapp来说,首次加载的体积会更加大,因为其要求的库更多,并且网速更慢,这个时候可以采取fake页的方案我们应该避免页面长时间白页,这个时候便提出了fake页的概念。页面渲染只需要完整的HTML以及CSS,这个便是第一个优化点。从数据请求数以及请求量来说,webapp首页的响应应该比较慢,若是任由js加载完成再渲染页面,用户很有可能失去耐心。但是从DOMContentLoaded来看,首页事实上页面响应比较迅速,所以这个加载结束后页面第一屏便渲染结束,然后再异步加载js,当js改变后再动态改变dom结构中的一些关键点,这个时候一个静态HTML页面,装载首屏的基本内容,让首页快速显示,然后js加载结束后会马上重新渲染整个页面,这个样子,用户就可以很快的看到页面响应,给用户一个快的错觉,给人感觉快得多。是否按需加载按需加载的话确实会对首屏加载有好处,但是是否按需加载却不一定了,按需加载需要加载js和模板,这个过程自然卡,所以真正是不是要按需加载,或者多少资源按需加载有个临界值,需要不断的测试才行最后,要减少资源的话,代码的质量神马的也需要考虑的,但对容量来说效用可能不是太大IOS的体验IOS的体验好,主要好在两点: 清晰、简洁、傻瓜化设计,连我妈都可以轻巧的操作苹果手机其简易型可想而知 用户行为模拟,IOS体验第二点便是其无敌的动画效果若是说web应用想赶上(寒冬老师这里赶上一词用得十分贴切,他要说超过估计没人理他了)native开发的话还是有可能但是如果说web应用要赶上IOS的设计的话,那么还有无数荆棘需要踩过!并且有两大前提: 网速快,用户不必关心资源大 手机性能好,不说超越PC,至少能“赶上”PC吧以上两点成立的话,web应用赶上IOS体验才变得可能,简单来说就动画而言,前端有哪些问题呢?webapp中的动画,webapp的一大优势便是在view切换时候可以拥有媲美与native的动画效果,但是很多时候那只是一种想法,真正的情况却不是这样产生此问题的原因有: 手机CPU烂! 手机显卡烂!就算四核其渲染也很有问题 高端手机浏览器会有BUG 低端手机支持不好(国内山寨机笑而不语)因为以上原因,事实上做webapp的都会不同程度的弱化动画,或者在局部区域使用动画难在何处?dom树过多view的移动与简单的图片slider组件相差甚剧!原因便是其dom结构可能很复杂,大dom树的移动在移动端效果很差就简单列表页来说,当项目超过100个时,使用IScroll类插件都应该很慎重,这类移动可能非常卡!而且dom树复杂度与业务直接相关,我们没有任何办法去控制dom树,因为业务代码可能不会经过我们的手,就算经过,你又肯定自己做出来的dom树有多小?不见得吧长短页问题所谓长短页便是一个view很长一个view很短,这里问题处理十分讨厌,首先我们每次做切换需要将view位置切换至头部(window.scroll(0, 0))如此的话ios中会引起页面viewport的变化(系统自动发生),或者会触发低端工具栏的出现,这个时候页面抖动无可避免若是每次不执行window.scroll(0, 0),切换时候又会导致短的view不可见我现阶段想到的解决方案是,移动时候将scroll设得比较大,移动时候将bview的top值与scrollTop相同最后仍然需要执行window.scroll(0, 0)的操作,所以,这个问题只能缓解,无法解决手机渲染问题只要是做移动端的朋友,一定会对三星机或者一些低端机的渲染嗤之以鼻!具体表现为多次操作style后,后面的操作浏览器不会搭理你解决方案是: 引起浏览器强烈重绘 临时增删一个dom结构但是涉及view切换动画的话,很有可能会出现一些莫名其妙的问题!所以单单由简单的webapp的切换都如此困难,web应用想赶上IOS的话还要等几年.Hybrid对前端的意义应该说Ajax带动了前端的首次革命,而移动端带来了二次革命,而Hybrid将前端推上了风口浪尖!原来我厂app是使用native开发的,会出现此等问题:一个应用需要养3个团队(ios、android、winphone),而且一旦业务改变会让开发抓狂!而Hybrid的出现解决了此问题,一套前端代码可以用于四个地方:浏览器、ios、android、winphone,而这个却是互联网公司最需要的最近两年,移动大潮袭来,各个公司皆在抢占移动端的份额,谁赢了这场战斗谁就是下一代王者,所以出现了一个事实:市场的占领、业务的扩展是第一位!所以Hybrid的市场与需求比native大,但是这不是说native没用了,因为更好的体验我们的追求,所以在Hybrid占领市场结束后,可能需要改版为native除非那时前端的体验能缩小与native的距离Hybrid开发的问题Hybrid提高了前端开发的门槛,因为Hybrid的调试难,但是业内也出现了一些调试的方案。Hybrid 兼容BUG多, H5站点上看着好好的程序,一旦到了webview上就出问题了,这个调试也很痛苦。哎,其实Hybrid开发也只是需要一点熟悉度罢了,没有什么可说,就此打住吧。中文名JSer含义类似于jQuery的开源脚本框架特点极大的简化您的javascript开发优点可以便捷的使用DOM操作JSer是一款类似于jQuery的开源脚本框架(为方便使用过jQuery的开发人员快速入门,许多方法调用都与其类似)。使用JSer,将极大的简化您的javascript开发,使程序代码更加简洁和高效!使用JSer,您几乎无需再考虑各浏览器的兼容问题,目前JSer兼容的浏览器核心:IE, Firefox, Opera, Chrome, safari。通过JSer,您可以便捷的使用DOM操作、CSS样式访问、属性读写、事件绑定、行为切换、动态载入、数据缓存、URL与AJAX等众多功能。Native App是一种基于智能手机本地操作系统如iOS、Android、WP(WinPhone)并使用原生程式编写运行的第三方应用程序,也叫本地app。SEO由英文Search Engine Optimization缩写而来, 中文意译为“搜索引擎优化”。SEO是指从自然搜索结果获得网站流量的技术和过程。SEO是指在了解搜索引擎自然排名机制的基础上,对网站进行内部及外部的调整优化,改进网站在搜索引擎中的关键词自然排名,获得更多流量,从而达成网站销售及品牌建设的目标KISSY 是由淘宝前端工程师们发起创建的一个开源 JS 类库。它遵循的原则是 小巧灵活、简洁实用、愉悦编码、快乐开发。Keep It,Simple & Stupid, Short & Sweet, Slim & Sexy.Yeah!流行的JavaScript库有jQuery,MooTools,Prototype,Dojo和YUI等,这些 JavaScript库功能丰富,加上它们众多的插件,几乎能实现任何你需要的功能,然而需要实现一些特定的功能,则可以选择功能更专一的轻量库,比如 kissy就是这样一个轻量的库。NodeJs特点 异步从文件读取到网络请求,NodeJs皆以异步完成,回调函数占据重要作用,在编程模型上Node是领先的 事件回调事件回调让程序变得轻巧,但是具体怎么样还是取决于程序员。但是回调函数在阅读上其实还是有一定难度的 单线程Node是单线程的,如果多线程的话,进程中的通信是很讨厌的,单线程也没有死锁等问题,但是性能相关就有问题了,因为不能利用多核;【js】js中的|和& 逻辑与&和逻辑或|操作符可以应用于任何类型的操作数,而不仅仅是布尔值。几乎所有语言中|和&都遵循“短路”原理, 如&中第一个表达式为假就不会去处理第二个表达式,而|正好相反。js同样也遵循上述原则:当逻辑或|时,找到为true的分项就停止处理,并返回该分项的值,否则执行完,并返回最后分项的值。当逻辑与&时,找到为false的分项就停止处理,并返回该分项的值。 var a = | null | 3 | 4;/32 alert(a);3 var b = 4 & 5 & null & 0;/null4 alert(b);document.createElement()方法来创建tr、td !-var _row;var _cell;for(var i = 0; i 1000; i+) _row = document.createElement(tr);document.getElementById(_table).appendChild(_row);for(var j = 0; j 第一题,img title与alttitle是用于鼠标划上时候显示的提示信息,而我们的图片总会有原因不显示,这个时候alt便会替代文字显示,而且alt对于seo十分友好,所以我们所有的图片必须加上alt,这样浏览器就知道他是干什么的了。第二题,加粗,居中,下划线标签这道题感觉意义不大,以为以上几个标签除了strong,其它我没有用过,他可能会到语义化相关然后问CSS怎么用吧?3 写出一个文本输入框,属性为只读,最大输入字符为20个CSS左边固定,右边可变的布局实现方法;要求在源码顺序中左边必须在前。没有理解到想要问什么,按我的理解这个题考察以下知识: 内容优先 布局知识如何使一个DIV的背景图像距这个DIV的顶部10像素,左边15像素,且不重复background:url(yexiaochai.gif) no-repeat 15px 10px ;CSS基础-引入方法,选择器,继承 一.CSS引入方法:行内式、嵌入式、导入式、链接式。1、行内式。 在标签的style属性中设定CSS样式。 行内式2、嵌入式 将页面各种元素的设置集中写在标签里。 div background-color:blue; 3、导入式 将一个外部CSS文件引入CSS文件或HTML文件,注意此方法既能在CSS文件里使用也能够在HTML的标签之间使用。 import main.css; 4、链接式 将一个外部CSS文件引入HTML文件 二、选择器 1、ID选择器 根据HTML元素的id属性选择元素。 #div1 background-color:red;/* 选中id为div1的HTML元素 */ 2、class选择器 根据HTML的class属性选择元素。 .left background-color:red 我是class=left的div元素 3、标签选择器 根据HTML标签选择元素 CSS: div background-color:blue; HTML: 我是一个div元素4、复合选择器4.1 交集选择器 CSS: p.special color:red; /* 选中class=special的p元素 HTML: 我是一个p /* 不会被选中 */我是一个class=special的元素 /* 选中该行 */4.2 并集选择器 CSS: .special,div,p background-color:red; HTML: 我是一个class属性为span的元素 我是一个div元素 我是一个p元素 以上三行HTML代码都会被选中。4.3 后代选择器 后代选择器:选中所有后代元素 CSS: .special p background-color:red; HTML: 我是.special里的p元素 /* 会被选中 */ 我是.special里的p元素 /* 会被选中 */ 我也是一个p /* 不会被选中 */4.4直接后代选择器 即:选择直接子后代 CSS: .specialp background-color:red; 我是.special里的p元素 /* 会被选中 */ 我是.special里的p元素 /* 不会被选中,因为不是直接子元素,是孙子元素了 */ 我也是一个p /* 不会被选中,非子元素 */五、属性选择器CSS:atitle font-size:30px; /选中含有title属性的a元素我是第一个a标签 /会被选中,含有title属性我是第二个a标签 /不会被选中,没有title属性atitle=a1 font-size:30px; /选中title属性=a1的元素我 /会被选中,含有title,并且title=a1我是第二个a标签 /不会被选中,没有title属性我是第一个a标签/不会被选中,title!=a1其他属性符号:atitle=a1 选中 选中title属性中包含a1的元素,注意a与其他值要有空格atitle=a1 选中选中title属性以a1开头的元素atitle$=a1 选中 选中title属性以a1结束的元素atitle*=a1 选中 选中title属性中包含a1的元素atitle|=a1 选中或选中title属性中包含a1-开头或等于a1的元素,常用于选择src=logo- 1,logo-2等性。六、相邻兄弟选择器+CSS: span + pHTML:我是一个span我是一个p 我也是一
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 空山鸟语说课课件
- 二零二五版非上市公司员工股权激励项目合作协议
- 二零二五年度进出口合同履行中的市场调研与操作策略
- 二零二五年度害虫防治技术专利授权与实施合同
- 2025版城市绿化项目管桩供应与安装合同规范
- 2025版煤矸石环保工程承包购销合同在线版阅读
- 二零二五年度模特经纪公司兼职模特签约合同
- 二零二五年度LED广告屏安装与广告内容更新合同范本
- 2025年度市政道路工程质量保修管理合同
- 2025年度面包砖工程合同标准及服务承诺
- 建立并优化医院的药品管理体系
- 肿瘤全程康复管理制度
- 2025至2030中国护眼灯行业发展趋势预判及市场前景预测报告
- 青春期生理讲课件
- 2025年人教版小学一年级下册数学期末易错题测试试题(含答案和解析)
- 一书一签收发管理制度
- 2025-2030年中国财税服务行业市场深度调研及发展前景与投资研究报告
- 2025年酒店管理专业基础知识考试试题及答案
- 2024年咸阳市社区工作者计划招聘真题
- 2025年四川酒业茶业投资集团有限公司及下属子公司招聘笔试参考题库含答案解析
- 新能源汽车热管理系统的能量优化与梯级利用策略探讨
评论
0/150
提交评论