2018年02月_Byte_Dance

翻译 [插件封装]事件委派实现留言板案例

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>事件委派实现留言板案例</title>  <script s

2018-02-24 23:07:40 238

翻译 [封装插件]鼠标拖动元素跟随功能

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>鼠标拖动元素跟随功能</title>  <script sr

2018-02-24 21:04:49 517

转载 JS元素坐标定位 screenX clientX pageX概念

screenX clientX pageX概念screenX:鼠标位置相对于用户屏幕水平偏移量，而screenY也就是垂直方向的，此时的参照点也就是原点是屏幕的左上角。clientX:跟screenX相比就是将参照点改成了浏览器内容区域的左上角，该参照点会随之滚动条的移动而移动。pageX：参照点也是浏览器内容区域的左上角，但它不会随着滚动条而变动如图(红点就是鼠标当前位置)...

2018-02-24 20:40:19 1055

翻译 toggle() 事件隐藏和多种状态

如果某个元素调用了 toggle(), 那么就表示要把这个元素隐藏或者显示出来,括号里可以添加毫秒数,来规定具体显示或隐藏需要的时间;如果括号内是两个或多个函数toggle( fn1 , fn2...); 那么每点击一次,就会在这些函数中切换...

2018-02-21 13:16:58 1603

翻译 [封装插件]酒仙网和京东左侧动态菜单栏案例

酒仙网老式动态菜单栏:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>老式左侧导航栏</title>  <s

2018-02-21 12:34:33 363

翻译 CSS中大图片的几种居中方法

前段时间发现了一个让图片居中的写法，父标签{text-algin:center} img {margin:0 -100%}; 不过好像对一张图片管用,多张的话就容易出现问题了,单张居中的话感觉很是好用.另外一种原始写法 position:absolute; left:50%; ...

2018-02-20 21:26:24 279

原创 [封装插件]Jquery中的CSS处理一览以及回到顶部按钮和鼠标悬停获取坐标的案例

8:CSS处理 CSS样式 css(name) 访问第一个匹配元素的样式属性。$("p").css("color"); css(properties) 把一个“名/值对”对象设置为所有匹配元素的样式属性。 ...

2018-02-20 18:47:18 258

转载 (转)JavaScript及jQuery中的各种宽高属性图解

原文链接 http://blog.poetries.top/2016/12/13/js-props 声明：本文根据慕课网学习视频整理强烈建议打开控制台自己动手练习一遍，这样印象才会深刻第一部分 JavaScript中的宽高属性一、与window相关的宽高属性1.1 window.location和document.locationwindow对象的location属性引用的是location对象，...

2018-02-19 22:39:15 296

翻译 Jquery文档处理一览

1.内部插入 append(content | fn) 向每个匹配的元素内部追加内容。 $("A").append("B"); 把B内容追加到A元素内容最后 B-->A appendTo(content) 把所有匹配的元素追加到另一个指定的元素元素集合...

2018-02-18 19:59:32 538 2

转载 textContent与innerText的不同

textContent与innerText的不同 IE下有个innerText属性，FF下有个textContent属性。很多以前给IE写脚本的，在FF下找不到innerText属性，于是网上搜到的建议是用textContent来替代。反之给FF写脚本的也一样。但是实际上，这里有个误解。网上很多文章说“FF下等效于innerText属性的属性是textContent”————但是事实上并非如此。...

2018-02-18 11:56:19 688

翻译 Jquery属性一览

Jquery属性 1.属性 attr(name) 获取属性名字的值如 attr("src"), 在JS脚本中,使用this.src往往会返回一大堆的网页前缀而使用attr("src")就很纯净,本身的地址是什么就返回什么. ...

2018-02-16 22:18:21 254

翻译 Jquery筛选一览

首先我们要搞清楚,筛选和选择器的区别 :选择器是直接返回选中的对象，比如$("hid") ,这么做是使用id选择器直接返回一个对象而筛选则是从已经找到的对象中进一步做一些选取操作,简单来说就是选择器操作的是HTML标签, 而筛选操作的是已经选取了的Jquery对象 , first()是从集合中返回需要的对象，不更改原来的集合，你可以对集合进行更过的过滤操作，而选择器你只能重新另外选对象了筛选 1....

2018-02-16 21:33:06 430

原创 Jquery选择器一览

Jquery选择器 1:基础选择器 #id id名选择器 $("#hid") ele 元素选择器,例如选择所有的h1元素 $("h1") .class class 属性选择器,选择所有的class名一样的元素 $(".classname") * 所有元素选择器 $("*") sel1 , sel...

2018-02-16 20:43:46 195

原创 parent()父级 , prev()同辈 , children()子级关系查找演示

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>关系查找演示</title>  <script src=&q

2018-02-16 20:28:57 3722

原创表单中的button标签会自动提交表单问题

在form表单内插入一个button按钮,按钮点击后会自动提交表单,本来是想用Jquery给button添加一个事件用来设置多选框的全选全不选和反选的问题的,但是发现定义在form标签区域内的button点击之后没有反应,闪一下就过去了.于是给form表单的action属性赋了一个值,发现点击button按钮后表单提交了.于是将button按钮定义在form表单外部,以防止表单自动提交,还可以不...

2018-02-15 19:41:27 745

翻译 [封装插件]Jquery制作完整表单验证示例

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Jquery表单验证</title>  <script sr

2018-02-14 22:26:47 764

原创 [封装插件]使用Jquery实现点击就更换指定内容

先使用给标签添加属性的方法，然后再获取属性改变内容，比如给H1标签添加一个名称属性，然后再通过点击获取这个属性并赋值给里边的内容。弊端：标签属性一旦添加的过多，标签就会变得很臃肿，不利于将来查看代码<！DOCTYPE HTML > <HTML LANG = “EN” > <HEAD> <元的charset = “UTF-8” > ...

2018-02-12 22:03:47 499

翻译 [封装插件]使用Jquery制作一个标签页的效果

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Jquery实现鼠标滑动到页面上就显示那些固定内容</title>  &a

2018-02-12 21:41:40 329 1

翻译 hover和mouseover与mouseente以及mouseout和mouseleave的区别

hover ：悬停可以指定两个函数功能1和功能2，鼠标移入触发功能1，移除触发函数2;mouseover ：不论鼠标指针穿过被选元素或其子元素，都会触发mouseover事件。mouseenter ：只有在鼠标指针穿过被选元素时，才会触发mouseenter事件。这样的话，的mouseenter子元素不会反复触发事件，否则在IE中经常有闪烁情况发生。mouseout : 不论鼠标...

2018-02-12 18:44:44 767

转载 jQuery中this与$(this)的区别

原文链接 : http://blog.csdn.net/BaiHuaXiu123/article/details/51959955这里就谈谈this与$(this)的区别。1、jQuery中this与$(this)的区别 $("#textbox").hover( function() { this.title = "Test"; ...

2018-02-11 17:57:03 168

原创文档内的常用标签集合

获取元素的标签名：obj.tagName文档内的常用集合（1）：images集合用来操作HTML文档内的图片标签img的集合（2）：links集合用来操作HTML文档内所有带有href属性的a标签的集合（3）：锚集合用来操作HTML文档内所有带有名属性a标签的集合（4）：frames集合用来操作HTML文档内所有框架的集合（5）：forms集合用来操作HTML文档内所有表单标签表单元素的集合（6）...

2018-02-09 15:53:38 352

原创 [封装插件]实现多个下拉菜单select中的option移动操作

使用JS的写法:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <style> #form1{

2018-02-09 14:29:42 744 1

原创 DOM对象forms表单操作多选框执行全选,全部选,反选操作

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>form表单操作多选框</title></head><body><for

2018-02-08 22:32:21 816

原创 DOM操作forms表单对象

html>lang="en"> charset="UTF-8"> DOM中Element的forms集合 action="http://www.dingyifeng.site"> type="text"> type="text"> type="text"> action="https://www.ba

2018-02-04 18:32:17 616

转载 JavaScript：事件对象Event和冒泡

原文链接 : https://www.cnblogs.com/smyhvae/p/8413602.html本文最初发表于博客园，并在GitHub上持续更新前端的系列文章。欢迎在GitHub上关注我，一起入门和进阶前端。以下是正文。绑定事件的两种方式我们在上一篇文章 DOM操作详解中已经讲过事件的概念。这里讲一下注册事件的两种方式，我们以oncl

2018-02-04 17:27:54 364 2

转载 JAVA集合框架概述2

原文链接 :https://www.cnblogs.com/xiaoxi/p/6089984.html一、集合框架图简化图：说明：对于以上的框架图有如下几点说明1.所有集合类都位于java.util包下。Java的集合类主要由两个接口派生而出：Collection和Map，Collection和Map是Java集合框架的根接口，这两个接口又包含了一些

2018-02-04 16:43:44 226

转载 java集合框架概述

集合框架（collections framework）首先要明确，集合代表了一组对象（和数组一样，但数组长度不能变，而集合能）。Java中的集合框架定义了一套规范，用来表示、操作集合，使具体操作与实现细节解耦。其实说白了，可以把一个集合看成一个微型数据库，操作不外乎“增删改查”四种操作，我们在学习使用一个具体的集合类时，需要把这四个操作的时空复杂度弄清楚了，基本上就可以说掌握这个类

2018-02-04 16:36:05 147

Byte_Dance的博客