前端开发

￡神魔★判官ぃ 2022-02-15 15:31 274阅读 0赞

HTML: 超文本标记语言， 定义网页的结构  
HTML5是最新版本的HTML，是在html4的基础上增强了一些标签。像canvas video 等标签 画板，声音，web存储等高级功能。  
CSS: 层叠样式表用来美化页面  
css3：是最新版本的css是对原来的css2的功能增强，提供了一些原来在css2中实现比较困难或者不能实现的功能。  
盒子边框，盒子和文字的阴影、渐变、转换、移动、缩放、旋转、过渡、动画等。可以使用媒体查询实现响应式网站。  
缺点：要根据不同的浏览器处理兼容问题。其对应有一些兼容性的工具。  
Javascript: 主要用来验证表单，做动态交互（例如Ajax）  
bootstarp是一个移动设备优先的UI框架,我们可以不用写任何css js就能实现比较漂亮的有交互性的页面。  
平时用的很多的  
模态框  
表单 表单项  
布局  
栅格系统

AJAX是异步的Javascript和xml，通过ajax与服务器进行数据交换，ajax可以使网页实现布局更新。这意味着可以不重复加载整个网页的情况下，对页面的某部分进行更新。  
XmlHttpRequest对象，使用这个对象可以异步向服务器发送请求，获取响应，完成局部更新，Open send responseText/responseXML局部响应  
使用场景 登录失败时不跳转页面，注册时提示用户名是否存在，二级联动。现在更多的是用来进行数据的读写分离。  
JQ是JS的一个框架封装了JS的属性和方法，并且增强了JS的功能，让用户使用起来更加便利。  
$.ajax(\{ url: “test.html”, context: document.body, success: function()\{  
$(this).addClass(“done”);  
\}\});  
AJAX的几个参数 url请求地址，data传递数据， dataType返回数据类型（text，html,json等）；error错误 success:成功 type 常用的请求方式 GET或者POST  
或者直接使用以下方式  
POST请求  
$.post(“php/folders.php”, \{fun:“addDir”, dirname:dirname, newDirname:newDirname, fetchDir:dirname\}, function(res)\{  
alert(res);  
\}  
GET请求  
$.get(“php/folders.php”, \{fun:“addDir”, dirname:dirname, newDirname:newDirname, fetchDir:dirname\}, function(res)\{  
alert(res);  
\}

原生JS要处理很多兼容性问题，由JQUERY封装了底层，就不用处理兼容性问题。原生的js的dom和事件绑定和AJAX等操作非常麻烦，JQUERY封装以后操作非常简单方便。  
**JQUERY的常用选择器**  
id选择器 通过id获取一个元素  
class选择器 通过 class获取选择器  
标签选择器 通过标签获取元素  
通用选择器 （\*）获取所有的元素  
层次选择器  
子类选择器 > 获取下面的子元素  
后代选择器 空格 获取下面后代 包括儿子 孙子等后代  
属性选择器  
Tag\[attrName=‘box’\] 获取有属性名为xxx并且属性的值为box的所有标签。  
例如  
听音乐  
看电视  
input\[name=‘play’\]表示属性名为name并且name属性值为play的所有input标签元素。  
**JQ页面加载完毕事件**  
很多时候我们需要获取元素，但是必须等到该元素被加载完成后才能获取。我们可以把JS代码放到该元素的后边，但是会造成JS在我们的body中存在，不好管理。所以页面加载完毕后所有的原色当然已经加载完毕，一般获取元素做操作都要在页面加载完毕后操作  
$(document).ready(function()\{  
\});  
$(document) 把原生的document这个dom对象转换为Jquery对象，转换完成后才能调用ready方法  
ready(fn)表示的是页面结构被加载完毕后执行传入函数fn

$(function()\{  
\});  
当页面加载完毕后执行里面的函数. 这种方式使用较多。  
以上方式与window.onload的区别  
Jquery中的页面加载完毕事件，表示的是页面结构被加载完毕  
window.onload表示的是页面被加载完毕.就是说必须要等声音 图片 图像等资源被加载完毕后才能调用而JQ中只需要页面结构被加载完毕。  
原生JS的ajax和JQ的AJAX的关系。JQ中的ajax也是通过原生的js封装的，封装后使用更加便利，不用考虑底层实现和兼容性的问题。有好多比较成熟的框架都已经封装好了。