了解HTML/CSS/JS/JQuery/ajax等前端知识

什么是HTML

超文本标记语言
浏览器通过识别相应的标签来加载页面
通过HTTP协议传输,不是编程语言

HTML常用标签

title script style link meta link body
body标签
    h1-h6
    p
    br
    hr
    strong
    p
    b
    div  img   a     table tr td
列表标签
    ul
    ol
    li
表单标签
    input  redio checkbox text submit button resit password fiel  hidden  select

什么是CSS

层叠样式表
优点:
    页面表现统一  方便修改
    样式丰富,使用灵活
    减少代码量,增加加载速度,减少网络传输
    便于搜索引擎收录

CSS选择器和常用属性

<style type="text/css">
   li{
       标签选择器
   }
    .red{
       类选择器
    }
    #L1{
       ID选择器
    }
style>

常用属性
    color
    width
    high
    background-color
    font-size
    font-fimily
    font-weight

盒模型和定位

magin 边界  桌子
border 边框  盒子
padding 填充   盒子填充

相对定位和绝对定位
position:relative
position:absolute
top: 0px
right:10pxz-index:整数  越大越靠前

什么是JS

JavaScript是一种面向对象,解释性,基于事件的脚本语言
对象即使Json格式 组成: ECMAScript :核心 DOM:文档对象模型 与页面交互,操作HTML CSS BOM: 浏览器对象模型 与浏览器交互 引入方式: 1.直接写
<script type='text/javaScript'> js代码   script> 2.外部引入<script src='text/javaScript'>script>

JS类型

var = []  数组
var = {} 对象
var = 0  数字
var = "" 字符串
var = flase 布尔

遍历对象

var user = {id:1,name:'zhangsan',age:20};
for(key in user){
         alert(key+"<<<[key]);
}字符串转对象

var str =”{id:1,name:’zhangsan’}”;

var user = eval(str);

DOM 全选、反选、全不选

document.getElementById(“标签id属性值”) 非常常用!!!

<input type="checkbox" value="游戏" name="hobby" />游戏
<input type="checkbox" value="音乐" name="hobby" />音乐
<input type="checkbox" value="体育" name="hobby" />体育
<input type="button" value="全选" onclick="quanxuan();" />
<input type="button" value="全不选" onclick="quanbuxuan();" />
<input type="button" value="反选" onclick="fanxuan();" />
      function quanxuan(){
          var cs = document.getElementsByName("hobby");
          for(var i=0;i<cs.length;i++){
                cs[i].checked=true;
          }
      }
      function quanbuxuan(){
          var cs = document.getElementsByName("hobby");
          for(var i=0;i//alert(cs[i].value)
                //cs[i].checked="";
                cs[i].checked=false;
          }
      }
       function fanxuan(){
          var cs = document.getElementsByName("hobby");
          for(var i=0;i//alert(cs[i].checked);
                cs[i].checked = (!cs[i].checked);
          }
      }

改变样式
;i++){>
;i++){>

function f1(){

document.getElementById(“tt”).style.backgroundColor=”red”;

}

function f2(){

document.getElementById(“tt”).style.color=”blue”;

}

什么是jQuery

是一个js框架,封装了大量js代码
核心理念是写的更少,而做的更多百度jQuery引用地

jQuery基本选择器

$(function(){})  //页面加载完成后执行代码

ID选择器    $("#id")
元素选择器  $("元素名")
类选择器    $(".类名")

什么是AJAX

是一种创建交互式网页应用的网页开发技术,通过后台与服务器进行少量数据交换

AJAX请求方式

GET请求    $.get(url, [data], [callback], [type])
POST请求    $.post(url, [data], [callback], [type])
A JAX请求    $.ajax([settings])
GET请求    $.get([settings])
POST请求    $.post([settings])
            $.getJSON()    $(function(){$.ajax({url:url,async:truedate:datetype:'get'dataType:'json'success:function(){}error:function(){}})}

JSON

JSON(JavaScript Object Notation) JavaScript对象表示法。
是一种轻量级数据交换格式,易编写阅读,易解析生成JSONObject json = JSONObject.fromObject(map);

Original: https://www.cnblogs.com/cheng9999/p/11963578.html
Author: cheng_blog
Title: 了解HTML/CSS/JS/JQuery/ajax等前端知识

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/622230/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球