aoys602066-CSDN博客

转载操作元素

改变元素内容有两种方式 innerText 和 innerHTML相同点：这两个属性是可读写的，可以获取元素中的内容区别：1.innerText 在获取标签中的内容时，会去除空格和换行非标准的2. innerText 不识别 html 标签，如果想给插入的文本加入样式，需要使用innerHTML3.innerHTML 在获取标签中的内...

2019-09-27 21:20:00 127

转载事件三要素

1.事件是由三部分组成：事件源事件类型事件处理程序我们也称为事件三要素（1）事件源事件被触发的对象谁被触发（2）事件类型如何触发什么事件比如鼠标点击（onclick），鼠标经过，键盘按下（3）事件处理程序通过一个函数赋值的方式完成案例：点击一个按钮，弹出对话框　　<button id='bt...

2019-09-27 16:41:00 17312

转载 DOM中常见的元素获取方式

1.getElementById获取元素返回的是一个元素对象　var timer = document.getElementById('time');　console.dir 打印返回元素对象，更好的查看里面的属性和方法　console.dir( timer );2.getElementsByTagName 获取某类标签元素返回的是获取过来元素对象...

2019-09-27 16:06:00 174

转载 1.1内置对象案例

案例1：查找字符 ‘o’ 出现的位置及次数function find(str) { var index = str.indexOf('o'); var num = 0; while (index !== -1) { console.log(index); // 位置 num++; index =...

2019-09-26 13:22:00 125

转载 1.内置对象

一、Math对象：1）绝对值：Math.abs( )2）三个取整方法：Math.floor( ) 地板向下取整往小了取值Math.ceil( ) 天花板向上取整往大了取值Math.round( ) 四舍五入其他数字都是四舍五入，但是 .5 特殊，它往大了取值例：Math.round( -1.5 ); ...

2019-09-24 13:58:00 81

转载 0.对象

创建对象的三种方式：1.利用字面量创建对象 // 固定写法： var 对象名 = { 属性名：属性值 }　　var obj = {　　　　// 属性名：属性值；　　　　uname : "小A"，　　　　age : 18,　　　　sayHi : function(){　　　　　　console.log("hi~");　　　　}　　}2.利用 ...

2019-09-22 18:43:00 91

转载函数和变量中的预解析

1.js引擎运行 js 分为两步，预解析代码执行　　（1）预解析 js 引擎会把 js 里面的所有的 var 还有 function 提升到当前作用域的最前面　　（2）代码执行按照代码书写的顺序从上往下执行2.预解析分为变量预解析（变量提升）和函数预解析（函数提升）　　（1）变量提升就是把所有的变量声明提升到当前的作用域最前面不提升赋值操作　...

2019-09-22 13:49:00 221

转载 H5新增input表单、表单属性

　　新增表单email，Email类型　url ， Url类型date，日期类型time，时间类型month，月类型week，周类型number，数字类型tel，电话类型search，搜索框color，生成一个颜色选择表单　　表单属性　　required = required，必填，内容不能为空　　placeholder ，提示...

2019-09-03 19:23:00 181

转载 html5新增语义化标签

　　新增语义化标签<header>：头部标签<nav>：导航标签<article>：内容标签<section>：块级标签<aside>：侧边栏标签<footer>：尾部标签<audio>：音频标签<video>：视频标签　　1.音频标签（audio）...

2019-09-03 18:55:00 88

转载浏览器兼容性问题

　　　　1、问题：div中的图片间隙（出现在IE6及更低版本中）　　　　　描述：在 div 中插入图片时，图片会将 div 下方撑大三像素　　　　　解决方法：将 < img > 转换为块级元素，给 < img >添加声明：_display：block；　　　　2、问题：双倍浮向（双倍边距）　　　　　描述：当 IE6 及更低版本浏览器在解析浮动...

2019-09-03 13:55:00 107

转载初识 flex 布局

　　　　　　开启弹性盒模式： display：flex / inline-flex； inline-flex 行内弹性盒　　　　　　1、设置 flex 缩放的限定值　　　　　　　min-width 最小值 min-width：280px 最小宽度不能小于280px　　　　　　　max-width 最大值 max-width：1280px 最大宽度不能大于1...

2019-09-02 19:45:00 222

转载总结伪元素

　　　　div::before ，在 div 内容的前面加一个伪元素　　　　　　常用于处理相邻父子元素外边距重叠问题　　　　div::after，在div内容的后面添加一个伪元素　　　　　　常用于处理标签浮动，高度塌陷问题　　　　:before的兼容性要比::before好，不过在H5开发中建议使用::before比较好　　　　:befor是Cs...

2019-08-30 12:06:00 82

转载伪元素解决相邻父子元素垂直外边距重叠问题

2019-08-30 10:22:00 309

转载清除浮动的方法（float）

方式一：额外标签法：给浮动的元素后面新增加一个清除浮动的盒子例如： <div style="float: left">浮动盒子</div> <div style="float: left">浮动盒子</div> ...

2019-08-30 09:25:00 95

转载案例-开门效果CSS3

2019-08-29 19:20:00 141

转载 CSS3-2d3d

　　　　　　1、过渡（transition）操作谁，给谁加过渡　　　　　　　　transition：要过渡的属性花费时间运动曲线何时开始；多组属性变化，还是用逗号隔开　　　　　　　　transition-property：规定应用过渡的CSS属性的名称。　　　　　　　　transition-duration：定义过渡效果花费的时间，默认是...

2019-08-29 17:45:00 98

转载 CSS3-盒子模型

　　　　　　1、表格的细线边框　　　　　　　　border-collapse：collapse； // 边框合并在一起　　　　　　　　圆角边框（border-radius）　　　　　　　　border-radius：左上角右上角右下角左下角；　　　　　　　　// 取宽高的值一半就是圆形　　　　　　　　　width：200px；　　　　　　　　　h...

2019-08-23 08:12:00 126

转载 HTML5字体、伪元素、背景

　　　　　　　　1、字体样式：　　　　　　　　　　选择器 { font：font-style font-weight font-size / line-height font-family；}　　　　　　　　　　例：p { font： italic bold 14px / 1 ' 宋体 ' ；}　　　　　　　　　　注意：使用 font 属性时，必须按上面语法...

2019-08-22 08:48:00 207

转载 html5新增标签-input和video

<form action=""> <fieldset>  <legend>喜欢的明星</legend> <input type=...

2019-08-21 15:53:00 937

转载框架集 frameset

　　　　　　　　框架集和内联框架的作用类似，都用于在一个页面中引入其他的外部的页面　　　　　　　　　　框架集可以同时引入多个页面，而内联框架引入一个，　　　　　　　　　　在h5标准中，推荐使用框架集，而不使用内联框架　　　　　　　　使用 frameset 来创建一个框架集，注意 frameset 不能和 body 出现在同一个页面中　　　　　　　　　　所以要使用框架集，页...

2019-08-20 10:47:00 444

转载表单

form标签中必须指定一个action属性，该属性指向的是一个服务器的地址　　　　　　　　　　当我们提交表单时，将会提交到action 属性对应的地址　　　　　　　　　　　　在html中还为我们提供可一个标签，专门用来选中表单中的提示文字的 label 标签　　　　　　　　　　　　该标签可以指定一个 for 属性，该属性的值需要指定一个表单项的 id 值　　　　　...

2019-08-20 09:34:00 67

转载常用属性选择器

　　　　　　　　　　div，p：选择所有 div 元素和 p 元素　　　　　　　　　　div p：选择 div 内部所有的 p 元素　　　　　　　　　　div > p：选择父元素为 div 的所有 p 元素　　　　　　　　　　div + p：选择紧接在 div 之后的所有 p 元素　　　　　　　　　　2、属性选择器：　　　　　　　　　　　　　[ 属性名 ...

2019-08-20 09:07:00 258

转载背景颜色

　　　　　　　　1、设置背景样式：　　　　　　　　　　background-color：#bfa； // 设置背景颜色　　　　　　　　　　background-image：url(相对路径)； // 设置背景图片　　　　　　　　2、可以同时给一个元素指定背景颜色和背景图片，背景颜色会作为背景图片的底色　　　　　　　　　　background-repeat：re...

2019-08-19 18:24:00 213

转载定位 position

　　　　　　　　定位：　　　　　　　　　- 定位指的就是将指定的元素摆放到页面的任意位置　　　　　　　　　- 通过 position 属性来设置元素的定位　　　　　　　　　　- 可选值：　　　　　　　　　　　　static：默认值，元素没有开启定位　　　　　　　　　　　　relative：开启元素的相对定位　　　　　　　　　　　　absolute：开启元素的绝对定...

2019-08-19 17:31:00 235

转载 HTML常见问题

　　　　　　　　　　　　一、外边距，margin：　　　　　　　　　　　　　　垂直外边距的重叠：在网页中相邻的垂直方向的外边距会发生外边距的重叠　　　　　　　　　　　　　　所谓的外边距重叠指兄弟元素之间的相邻外边距会取最大值而不是取和。　　　　　　　　　　　　　　　　.box1{margin-bottom:10px;}　　　　　　　　　　　　　　　　.box2{margi...

2019-08-19 09:44:00 119

转载本地存储案例

$(function(){ xr(); $("#txt").on("keydown",function(e){ if(e.keyCode===13){ // 获取本地存储的数据，赋值给一个数组local var local=getData(); // 回车后数组中新增...

2019-08-15 13:22:00 371

转载对象拷贝extend

　　　　如果想要把某个对象拷贝（合并）给另外一个对象使用，此时可以使用$.extend()方法　　　　　　语法：　　　　　　　　$.extend([deep],target,object1,[objectN]);　　　　　　　　　　1.deep：如果设为true为深拷贝，默认false浅拷贝　　　　　　　　　　2.target：要拷贝的目标对象　　　　　　　　　　...

2019-08-14 10:57:00 112

转载仿微博发布效果

$(function(){ $(".btn").on("click",function(){ var li=$("<li></li>"); li.html($(".txt").val()+"<a>删除</a>"); $("ul").prep...

2019-08-14 08:55:00 222

转载 jQuery事件处理

一、事件处理 on() 绑定事件　　　on () 方法优势1：可以绑定多个事件，多个处理事件处理程序。　　$("div").on({ // 可以绑定多个事件　　 mouseover: function(){ }, 　　 mouseout: function(){ }, 　　 click: functi...

2019-08-13 17:33:00 68

转载仿电梯导航案例

JQ：$(function(){ $(window).scroll(function(){ //获取家用电器div距离顶部的高度 var navs=$(".con").children(".d1").offset().top; //判断页面滚动的高度是否不小于，家用电器距离顶部的高...

2019-08-13 14:53:00 171

转载仿购物车案例

JQ：$(function(){ //全选改变事件 $(".checkAll").change(function(){ // alert($(this).prop("checked")); $(".checkAll,.check").prop("checked",$...

2019-08-13 09:11:00 94

转载案例6：为每一行设置不同的字体颜色

2019-08-12 14:25:00 725

转载文本内容值

　　　　<div><span>文本内容</span></div>　　　　1.获取设置元素内容 html( )　　　　　$("div").html("123"); // 设置div的元素内容　　　　　("div").html( ); // <span>123</span>　　　　2.获取设置...

2019-08-11 22:08:00 138

转载案例5：全选和反选

2019-08-11 21:15:00 114

转载案例4：突出显示案例

2019-08-11 15:51:00 150

转载案例3：事件切换及动画队列停止排队效果

　　　　//鼠标移入事件　　　　$(".nav > li").mouseover(function(){　　　　　　$(this).children("ul").slideUp(200);　　　　})　　　　//鼠标离开事件　　　　$(".nav > li").mouseout(function(){　　　　　　$(this).children...

2019-08-10 23:16:00 132

转载案例2：tab栏切换

2019-08-10 20:30:00 123

转载修改css样式+jq中的效果+属性操作+元素操作

　　　　:checked 选框选中的　　　一、修改css样式：　　　　1.参数只写属性名，则返回属性值　　　　　　$(this).css( ' color '); //300px　　　　2.参数是属性名，属性值，逗号分隔，是设置一组样式，属性必须加引号，值如果是数字可以不用跟单位和引号　　　　　　$(this).css(" color "," red ") ...

2019-08-10 19:29:00 184

转载案例1：点击菜单显示相应的图片

<ul>　　<li><a>图1</a></li>　　<li><a>图2</a></li></ul><div id='con'>　　<div style="display: block"><img src=...

2019-08-10 19:06:00 243

转载 jq容易混淆点

　　　　jQuery链式编程：　　　　　　　　原：把当前元素颜色修改为红色，其余兄弟颜色不变　　　　　　　　　　$（this）.css("color",'red') ;　　　　　　　　　　$（this）.siblings（）.css("color"," ") ;　　　　　　　　简化后：　　　　　　　　　　$（this）.css('color','red').sibli...

2019-08-10 17:51:00 90

空空如也

空空如也