关注
分享
学习小网页入门
一只编程的嵩鼠
喜欢小仙女ε=ε=ε=ε=ε=ε=┌(;￣◇￣)┘
一起学习探讨问题留言邮箱：1446178451@qq.com
可以关注 一只编程的嵩鼠~
展开
-
jQuery基础题
1.下列关于CSS的伪类选择器说法错误的是 C2下列关于链式语法说法错误的是 ACD3.下列说法正确的是 BCD4.B5.下列关于trigger和triggerHandler两个方法，说法错误的是 AD6.下列关于Chosen选择框插件说法正确的是 ABC7.关于DOM对象和jQuery对象，下面的说法正确的是？ABC8.A9.弹出层窗体div层通常使用什么定位方式？A10.关于jQuery对象和DOM对象的检测，错误的是 A...原创 2020-10-14 20:45:41 · 302 阅读 · 0 评论 -
8.jQuery实现瀑布流
瀑布流是啥只要你往下滚动，就会一直有内容出现，永远看不完。实战瀑布流：基本结构的结构层和表示层瀑布流布局：js布局，jQuery布局，布局方式比较原创 2020-10-14 19:20:12 · 255 阅读 · 0 评论 -
7.jQuery弹出层小栗子
弹出层使用场景：注册登陆统一的消息提示框减少页面跳转，刷新等一些操作主要组成部分：1遮罩层2弹出窗口这两个都是用div实现，jQuery动态控制隐藏显示3对弹出层进行简单封装4登陆表单简单校验以mooc网为例：<html><head> <meta charset="utf-8"> <title>jquery弹出层</title> <script type="text/javascript" src="../js原创 2020-10-12 22:11:36 · 302 阅读 · 0 评论 -
6.jQuery插件的使用
jQuery插件机制jQuery虽然很强大，但也不可能包含我们项目中用到的各种功能。所以jQuery打造成了很容易被扩展的库。允许通过插件扩展jQuery的功能。如何寻找自己需要的插件官方网站上http://plugins.jquery.com/不过官方好像不再维护，并推荐到npm上去搜jquery-pluginhttps://www.npmjs.com/基本上npm上管理的在github上都有。https://github.com/再不行直接google了。一般使用星星多的(1k已经原创 2020-10-12 21:31:59 · 370 阅读 · 0 评论 -
5.jQuery的事件的介绍及使用
浏览器的事件模型在js中有两种事件模型：DOM 0级事件模型 基本所有浏览器都支持DOM 2级事件模型 绝大部分现代浏览器支持还是上代码举例说明8 <p id="example" onclick="console.log('Click');"> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis praesentium, sapiente? Earum, molestiae rem.原创 2020-10-11 17:19:54 · 144 阅读 · 0 评论 -
4.jQuery修改对象的内容和样式
修改元素样式可以通过className和attr()修改元素类名之类的。但jQuery提供了更好的方式：$(function () { var element = $( '#demo ' ); element.addClass( 'red b10 m10 p10') element.removeClass( 'red m10 p10 ') //也可以加函数，removeClass也一样，他们都是批量操作 element.addClass(function(index，className){原创 2020-10-10 20:08:24 · 745 阅读 · 0 评论 -
3.jQuery操作元素的特性和属性
其实特性和属性区别并不大，都会被翻译成属性，所以不用刻意去区分两者，可以统一叫属性。获取特性的值: attr(name)设置特性的值:attr(name, value) attr(attributes)删除特性:removeAttr(name)<img id="logo" src="logo.jpg" alt="jQuery logo" class="img-jquery" title="jQuery logo"/><img id="logo2" src="logo.jpg" .原创 2020-10-10 15:55:08 · 113 阅读 · 0 评论 -
2.jQuery的DOM操作
获取的元素都会被封装到一个类数组里，也可以叫它jQuery对象集合/jQuery元素集合。jQuery对象，jQuery集合，jQuery对象集合，jQuery元素集合这四个可以理解为同一个东西。我们除了获取之外，还可能需要检查数量，父子邻居关系，过滤元素的集合，遍历等等。我们先来给页面添加东西，例如创建html元素。//来个百度超链接$( function(){ var link1 = $("<a>"，{ text:'baidu', href : "http://www..原创 2020-10-09 22:23:45 · 240 阅读 · 0 评论 -
1.jQuery又是啥
What？js刚学会一点，又来jQuery， (…•˘_˘•…)前端是不是学不完的啊。那jQuery到底是啥？百度百科说： jQuery是一个快速、简洁的JavaScript框架，是继Prototype之后又一个优秀的JavaScript代码库（或JavaScript框架）。jQuery设计的宗旨是“write Less，Do More”，即倡导写更少的代码，做更多的事情。它封装JavaScript常用的功能代码，提供一种简便的JavaScript设计模式，优化HTML文档操作、事件处理、动画设计和Aj原创 2020-10-08 19:42:45 · 234 阅读 · 0 评论 -
JS完结：用JavaScript写个功能完善的电商轮播图
轮播图：自动轮播+点击对应点切换+下一张+菜单导航先讲思路，再上代码：html+css+JavaScript代码分别如下<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="css/style.css"></head>&l原创 2020-10-02 11:12:52 · 4271 阅读 · 0 评论 -
JavaScript的BOM又是个啥
BOM掌握什么是BOM掌握BOM对核心：-window对象掌握window对象的控制，弹出窗口方法BOM(Browser Object Model)浏览器对象模型它提供的对象主要有：window navigator screen history location document event全局变量：脚本的任何一个地方都能调用的变量所有的全局变量和全局方法都被归在window上<body> <div id="box"> <span>iphone原创 2020-10-02 08:33:09 · 1894 阅读 · 1 评论 -
JavaScript中DOM事件
DOM事件什么是事件？事件就是文档或浏览器窗口中发生的一些特定的交互瞬间。主要有HTML事件和DOM事件。HTML事件：直接在HTML元素标签内添加事件，执行脚本。<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style> .btn{width:140px;hei原创 2020-10-01 22:30:29 · 371 阅读 · 0 评论 -
JavaScript的DOM基础
DOM基础掌握基本的DOM查找方法document.getElementById()document.getElementByTagName()掌握如何设置DOM元素的样式<div class="box" id="box">csdn</div><script>var box = document.getElementById("box");console.log(box);</script><div class="box"原创 2020-10-01 18:47:04 · 212 阅读 · 0 评论 -
4.js中的内置对象
js中的内置对象字符串，函数，数组Array String Math DateECMAScript中的Array数组1、掌握如何创建数组//创建—个保存颜色的数组var colors=new Array(3); //3代表长度，可以放几个数组元素var nums=new Array (1,3,6，9) ;//直接写出数组元素console.log (nums );colors[0]="#f00";colors[1]="#0f0";colors[2]="#00f";//字面量显原创 2020-10-01 16:43:36 · 275 阅读 · 0 评论 -
3.JavaScript函数入门
js的函数初学函数的作用：通过函数可以封装任意多条语句，而且可以在任何地方，任何时候调用执行。函数的定义：通过function声明，后跟一组参数及函数体：function myFun(){ alert('hello world');}myFun();function myFun2(num1,num2){ var sum=num1+num2; alert(num1+'和'+num2+'相加的结果是'+sum); }myFun2(3,5);虽然可以反复调用，但一直alert，原创 2020-10-01 11:24:06 · 1112 阅读 · 0 评论 -
2.JavaScript的条件和循环语句真的会用吗
js中的条件语句分支和循环语句if语句var age = prompt("请输入您的年龄：");if( age<18 ){ alert("你还未成年");}else if(age>100){ alert("bu");}else{ alert("你成年");}prompt()弹出输入框，点击确定，返回输入内容，点击取消，返回nullalert()弹出警告对话框string.length用来获取string字符串的长度，返回值为numbervar password原创 2020-10-01 10:40:14 · 219 阅读 · 0 评论 -
JavaScript来了
1、了解什么是JavaScript ? JavaScript是一种基于对象和事件驱动的客户端脚本语言，最初的设计是为了检验HTML表单输入的正确性，起源于Netscape公司的LiveScript语言。2、了解JavaScript的发展历史能够处理复杂的计算和交互web的重要组成部分成一个简单的输入验证器到一个强大的编程语言简单又复杂3、了解JavaScript的组成部分4、在HTML中使用JavaScript可以在head或body中使用s原创 2020-10-01 09:55:07 · 272 阅读 · 0 评论 -
13.前端之css网页布局来个小栗子
布局要根据：开发习惯难易程度可维护性来自己设置小页面布局的html和css如下：<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>CSS网页布局</title> <link rel="stylesheet" href="css/index.css"> </head><body><!-- 头部 -.原创 2020-09-30 07:32:16 · 247 阅读 · 0 评论 -
12.前端小白学个CSS网页布局
认识布局以最适合浏览的方式将图片和文字排放在页面的不同位置布局模式有多种，不同的制作者会有不同的布局设计为什么要学习网页布局呢？这是制作一个好的网页的基础行布局，多列布局，圣杯布局，双飞翼布局在学习之前肯定要掌握：HTML和CSS基础会使用DIV+CSS进行排版熟悉float属性，position属性经典的行布局-基础的行布局-行布局自适应-行布局自适应限制最大宽-行布局垂直水平居中body{ margin:0; padding: 0; color:#fff; text原创 2020-09-30 07:19:24 · 184 阅读 · 0 评论 -
11.前端之css真正的的定位position来了
定位两大元素块级元素：div h1~h6 ul li ol table p 等等内联元素：a span img input等等<style>*{padding: 0;margin: o;}.test{width:100px;height: 100px;background:red ;margin-right: 10px;}</style><div class="test"></div><div class="test原创 2020-09-29 22:16:07 · 244 阅读 · 0 评论 -
10.前端之css中的float浮动怎么这么好用
float四个参数：left，right，none，inherit继承实现文本环绕，水平排列，解决父元素塌陷如何利用清除浮动，解决塌陷问题利用float：left；实现块级元素水平排列<style>*{padding: 0;margin: o;}.test{width:100px;height: 100px;background:red ;float: left;margin-right: 10px;}</style><body> &原创 2020-09-29 20:37:23 · 295 阅读 · 0 评论 -
9.前端之CSS盒子能装啥
盒子模型widthheightpaddingbordermargin宽度∶width:长度值│百分比|auto最大宽度﹔max-width:长度值│百分比|auto最小宽度∶min-width:长度值│百分比| auto说明∶设置块级元素和替换元素的内容宽度ie6不支持最大最小宽度/高度块级标签占一整行，充满背景颜色，可以设置宽高高度:height:长度值│百分比|auto最大高度:max-height:长度值│百分比|auto最小高度:min-height原创 2020-09-29 19:55:48 · 162 阅读 · 0 评论 -
8.前端小白之CSS背景和列表
背景和列表css背景样式background-colorbackground-imagebackground-positionbackground-attachmentbackground-repeatbackground 简写，将背景属性设置在一个声明中css列表样式list-style-typelist-style-imagelist-style-positionlist-style 简写背景包括content,padding,border,但没有marginborder如原创 2020-09-29 17:52:38 · 190 阅读 · 0 评论 -
7.前端入门小工具之PS辅助
前端切图入门：切图+码代码用Photoshop会产生大量缓存先改变缓存盘路径，默认单位的修改pxps预设：工具，标尺，图层，信息，字符用标尺可以更好的裁剪图片，1像素之间也不行切片工具可以实现快速生成多个图片，但不是很适合切好图片生成png图片格式，取名要有意义吸取颜色获取rgbCSS雪碧 即CSS Sprite，也有人叫它CSS精灵，是一种CSS图像合并技术，该方法是将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分。该图片使用CSS backgr原创 2020-09-28 22:03:50 · 322 阅读 · 0 评论 -
6.前端入门之CSS字体和文本
CSS字体与文本样式文字：颜色，字体大小，字体，加粗等等文本：行高，对齐方式和文本装饰等文字样式属性：font-familyfont-sizecolorfont-weightfont-style在html4.0之前，可以用font，但4之后就不用了<font face="宋体" color="red" size="12px">hiii</font><style> h1{font-family:"宋体"，"Times New Roman";}<原创 2020-09-28 20:47:54 · 280 阅读 · 0 评论 -
5前端入门之CSS是什么
HTML、CSS、JavaScript的关系html是网页内容的载体css样式是表现，外观控制JavaScript是行为，用来实现网页特效效果今天开始每日一单词yearn/thirst/long for取代be eager for什么是CSSCascading Style Sheets 层叠样式表用于定义html内容在浏览器的显示样式发展历史1996 W3C CSS11998 W3C CSS2now W3C CSS3在手机页面开发中经常用到H5和CSS3在电脑端由于浏览器兼容原创 2020-09-28 19:31:45 · 495 阅读 · 0 评论 -
4网页整体结构布局HTML
先整体布局，然后一块一块来做如何灵活和合理的使用div<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>小案例</title></head><body> <!-- 头部内容 --原创 2020-09-26 21:37:07 · 701 阅读 · 0 评论 -
3.前端入门之HTML表单
主要内容表单应用场景表单结构常用表单元素使用表单交互属性案例注册或登录页面都要用到收集信息，数据打包，传输给服务器，web交互表单<form> 表单元素：文本框，单选框，复选框，按钮，列表... <input>表单输入 <select>菜单和列表 <option>列表项目 <textarea>文字域 <optgroup>项目分组</form><input type="类型属性" na原创 2020-09-26 21:17:13 · 169 阅读 · 0 评论 -
入门2.HTML表格
HTML表格主要内容：了解表格应用场景表格基本结构如何操作表格表格属性表格跨行跨列案例：表格网页布局数据的展示HTML表格<table border="1">表格 <caption></caption>表格标题，居中显示 <thead> <tr>行 <th>表格头，内容居中，加粗显示</th> </tr> </thead> <tbody> <tr原创 2020-09-26 19:55:57 · 352 阅读 · 0 评论 -
前端小白入门篇1
HTML基础什么是HTML?HyperText Markup Language 超文本标记语言HTML发展史1993年 IETF 发布HTML1.01995年 W3C 发布HTML2.01996年 W3C 发布HTML3.21997年 W3C 发布HTML4.01999年 W3C 发布HTML4.0.12000年 W3C 发布XHTML1.02001年 W3C 发布XHTML1.1XHTML2.0?2004年 WHATWG 发布HTML5草案2008年 合并 发布HTML5正式版原创 2020-09-26 19:03:08 · 327 阅读 · 0 评论