黎明启程
黎明启程

h5c3知识概述

H5C3

《购物车宣传》案例

综合运用h5c3知识且进行一定扩展

能使用jquery完成网页常见交互行为

实际工作开发当中能应对活动宣传页

FullPage插件

  • 插件功能介绍

    • 基于 jQuery 的插件，它能够帮你很方便、很轻松的制作出全屏网站。
    • 支持鼠标滚动，支持前进后退和键盘控制，多个回调函数，
      支持手机、平板触摸事件，支持 CSS3 动画，支持窗口缩放，窗口缩放时自动调整，
      可设置滚动宽度、背景颜色、滚动速度、循环选项、回调、文本对齐方式等等。
    • 参考文档：http://www.dowebok.com/demo/2014/77/
    • 原理：window.onmousewheel = function(){ console.log(‘ok’) };

  • 使用步骤

    • 引用文件

    • html结构
      第一屏
      第二屏
      第三屏的第一屏
      第三屏的第二屏
      第三屏的第三屏
      第三屏的第四屏
      第四屏
    • js初始化
      $(function(){
      $(’#fullpage’).fullpage();
      });

  • 配置

    选项 类型 默认值 说明
    verticalCentered 字符串 true 内容是否垂直居中
    resize 布尔值 false 字体是否随着窗口缩放而缩放
    slidesColor 函数 无 设置背景颜色
    anchors 数组 无 定义锚链接
    scrollingSpeed 整数 700 滚动速度，单位为毫秒
    easing 字符串 easeInQuart 滚动动画方式
    menu 布尔值 false 绑定菜单，设定的相关属性与 anchors 的值对应后，菜单可以控制滚动
    navigation 布尔值 false 是否显示项目导航
    navigationPosition 字符串 right 项目导航的位置，可选 left 或 right
    navigationColor 字符串 #000 项目导航的颜色
    navigationTooltips 数组 空 项目导航的 tip
    slidesNavigation 布尔值 false 是否显示左右滑块的项目导航
    slidesNavPosition 字符串 bottom 左右滑块的项目导航的位置，可选 top 或 bottom
    controlArrowColor 字符串 #fff 左右滑块的箭头的背景颜色
    loopBottom 布尔值 false 滚动到最底部后是否滚回顶部
    loopTop 布尔值 false 滚动到最顶部后是否滚底部
    loopHorizontal 布尔值 true 左右滑块是否循环滑动
    autoScrolling 布尔值 true 是否使用插件的滚动方式，如果选择 false，则会出现浏览器自带的滚动条
    scrollOverflow 布尔值 false 内容超过满屏后是否显示滚动条
    css3 布尔值 false 是否使用 CSS3 transforms 滚动
    paddingTop 字符串 0 与顶部的距离
    paddingBottom 字符串 0 与底部距离
    fixedElements 字符串 无
    normalScrollElements 无
    keyboardScrolling 布尔值 true 是否使用键盘方向键导航
    touchSensitivity 整数 5
    continuousVertical 布尔值 false 是否循环滚动，与 loopTop 及 loopBottom 不兼容
    animateAnchor 布尔值 true
    normalScrollElementTouchThreshold 整数 5 -

  • 方法

    名称 说明
    moveSectionUp() 向上滚动
    moveSectionDown() 向下滚动
    moveTo(section, slide) 滚动到
    moveSlideRight() slide 向右滚动
    moveSlideLeft() slide 向左滚动
    setAutoScrolling() 设置页面滚动方式，设置为 true 时自动滚动
    setAllowScrolling() 添加或删除鼠标滚轮/触控板控制
    setKeyboardScrolling() 添加或删除键盘方向键控制
    setScrollingSpeed() 定义以毫秒为单位的滚动速度

  • 回调函数

    名称 说明
    afterLoad 滚动到某一屏后的回调函数，接收 anchorLink 和 index 两个参数，anchorLink 是锚链接的名称，index 是序号，从1开始计算
    onLeave 滚动前的回调函数，接收 index、nextIndex 和 direction 3个参数：index 是离开的“页面”的序号，从1开始计算；nextIndex 是滚动到的“页面”的序号，从1开始计算；direction 判断往上滚动还是往下滚动，值是 up 或 down。
    afterRender 页面结构生成后的回调函数，或者说页面初始化完成后的回调函数
    afterSlideLoad 滚动到某一水平滑块后的回调函数，与 afterLoad 类似，接收 anchorLink、index、slideIndex、direction 4个参数
    onSlideLeave 某一水平滑块滚动前的回调函数，与 onLeave 类似，接收 anchorLink、index、slideIndex、direction 4个参数

搭建页面开发结构




    
    购物网站宣传页面

完成八屏页面动画

  • 模块一: 标题(title)
  • 模块二: 商品列表(list)
  • 模块三: 选购(buy)
  • 模块四: 填写信息(info)
  • 模块五: 付款(payment)
  • 模块六: 送货(delivery)
  • 模块七: 评价(appraise)
  • 模块八: 购物(shopping)

具体需求参照示例

《QQ TIM》案例

Stellar插件

  • 描述

    • 视差滚动（Parallax Scrolling）指网页滚动过程中，
      多层次的元素进行不同程度的移动，视觉上形成立体运动效果的网页展示技术
      主要核心就是前景和背景以不同的速度移动，从而创造出3D效果。
      这种效果可以给网站一个很好的补充。

  • 特性

    • 视差滚动效果酷炫，适合于个性展示的场合。
    • 视差滚动徐徐展开，适合于娓娓道来，讲故事的场合。
    • 视差滚动容易迷航，需要具备较强的导航功能。

  • 原理

    • 传统的网页的文字、图片、背景都是一起按照相同方向相同速度滚动的，
      而视差滚动则是在滚动的时候，内容和多层次的背景实现或不同速度，或不同方向的运动。
      有的时候也可以加上一些透明度、大小的动画来优化显示。利用background-attachment属性实现。

  • 使用步骤

    • 引用文件
    • html结构

      TEXT HERE




      TEXT HERE




      TEXT HERE




      TEXT HERE




      TEXT HERE




      TEXT HERE


    • 基本样式
      .content {
      background-attachment: fixed;
      height: 400px;
      }
      #content1 {
      background-image: url("…");
      }
      #content2 {
      background-image: url("…");
      }
      #content3 {
      background-image: url("…");
      }
      #content4 {
      background-image: url("…");
      }
      #content5 {
      background-image: url("…");
      }
      #content6 {
      background-image: url("…");
      }
    • js初始化
      $.stellar({
      horizontalScrolling: false,
      responsive: true
      });

  • 参数解释

    名称 说明
    horizontalScrolling 和 verticalScrolling 该配置项用来设置视差效果的方向。horizontalScrolling设置水平方向，verticalScro设置垂直方向， 为布尔值，默认为true
    responsive 该配置项用来制定load或者resize时间触发时是否刷新页面，其值为布尔值，默认为false
    hideDistantElements 该配置项用来设置移出视线的元素是否隐藏，其值为布尔值，若不想隐藏则设置为false
    data-stellar-ratio=“2” 定义了此元素针对页面滚动的速度比率，比如，0.5为页面滚动的50%，2为页面滚动的200%，所以数值越大，你可以看到页面元素滚动速度越快。
    data-stellar-background-ratio 该配置项用在单个元素中，其值为一个正数，用来改变被设置元素的影响速度。 例如 值为0.3时，则表示背景的滚动速度为正常滚动速度的0.3倍。如果值为小数时最好在样式表中设置

完成视觉滚动差页面开发

  • 模块一: 导航(nav)
  • 模块二: 宣传(banner)
  • 模块三: 语音聊天(sound)
  • 模块四: 文件传输(file)
  • 模块五: 兴趣部落(interest)
  • 模块六: 底部(footer)

具体需求参照示例

H5-dom扩展

获取元素

document.getElementsByClassName ('class'); 
//通过类名获取元素，以伪数组形式存在。

document.querySelector('selector');
//通过CSS选择器获取元素，符合匹配条件的第1个元素。

document.querySelectorAll('selector'); 
//通过CSS选择器获取元素，以伪数组形式存在。

类名操作

Node.classList.add('class'); 
//添加class

Node.classList.remove('class'); 
//移除class

Node.classList.toggle('class'); 
//切换class，有则移除，无则添加

Node.classList.contains('class'); 
//检测是否存在class

自定义属性

在HTML5中我们可以自定义属性，其格式如下data-*=""

你可能感兴趣的:(h5c3知识概述)

  • python 推导式(派生、衍生) sanduo112 人工智能pythonwindows开发语言
    python推导式一、推导式(派生、衍生)1.Python推导式是一种独特的数据处理方式，可以从一个数据序列构建另一个新的数据序列的结构体。2.列表(list)推导式3.字典(dict)推导式4.集合(set)推导式5.元组(tuple)推导式二、代码概述一、推导式(派生、衍生)1.Python推导式是一种独特的数据处理方式，可以从一个数据序列构建另一个新的数据序列的结构体。Python支持各种数
  • Django之Debug篇 菜鸟之编程 Djangodjangopython后端
    一、DebugToolBar基本使用1.1、概述Django框架的调试工具栏使用django-debug-toolbar库，是一组可配置的面板，显示有关当前请求/响应的各种调试信息，点击时，显示有关面板内容的更多详细信息。官方文档：DjangoDebugToolbar—DjangoDebugToolbar4.3.0documentation1.2、安装pipinstalldjango-debug-
  • 1.计算机处理器架构+嵌入式处理器架构及知识 vv 啊 arm-linux学习linux系统架构
    目录一：x86-64处理器架构二：Intel80386处理器（i386）1.i3862.i686三：嵌入式Linux知识：1.MinGW2.GNU计划2.1GNU工具链概述此次只分享英特尔和ADM处理器有关于x86的架构，至于嵌入式处理器架构请查看https://en.wikipedia.org/wiki/List_of_ARM_processors一：x86-64处理器架构x86-64，也称为x
  • 入伏（五） 喜马ma
    图片发自App入伏13今天我看见很多蜻蜓在飞飞得很低想起小学时学的那点知识在这闷热的午后真能来一场暴雨太过瘾了入伏14有点像瓢虫的昆虫喜欢吃葡萄叶喜欢交配在炎热的夏天如果你在葡萄园看见两只昆虫它们不是在吃葡萄叶就是在交配请记住它们的名字叫葡萄十星红甲
  • 【嵌入式模块】步进电机使用总结 记录无知岁月 #嵌入式设备嵌入式硬件步进电机
    关于本博客  此前上了一门课《自动控制元件》，但是由于学时有限，讲到步进电机就不讲了，留下了一个小遗憾，导致需要使用步进电机时就有点懵，于是找了一篇博客，链接在这里，推荐具有电机知识（如直流电机，异步电机等）的朋友看，如果完全不懂，建议先啃书。
  • 【转载】SSD测试第一神器——FIO running_sheep
    转自：[http://www.ssdfans.com]对于SSD性能测试来说，最好的工具莫过于FIO了。FIO是Jens开发的一个开源测试工具，功能非常强大，本文就只介绍其中一些基本功能。线程，队列深度，Offset，同步异步，DirectIO，BIO使用FIO之前，首先要有一些SSD性能测试的基础知识。线程指的是同时有多少个读或写任务在并行执行，一般来说，CPU里面的一个核心同一时间只能运行一个
  • 计划比盲目做重要 一祉微笑
    坚持分享第99天。一次次会议提醒着老师们假期余额不足，马上面临停机状态。50多天掐指而过，想想放假时的计划，对照如今的完成情况，感觉差太远。想着好好看书，如今50多天过去了第6本还处在未完待续状态；想着假期好好陪陪孩子，在玩中学一些知识，如今想想，孩子学的真不多；想着暑假坚持跑步，有时还是容易给自己找借口，休息三两天。给这个假期一个综合评价，只能说只完成了计划的百分之五六十。想想为什么临近开学没达
  • Flutter运行flutter doctor 命令长时间未响应如何解决 咕噜签名分发-淼淼 flutter
    Hello大家好！我是咕噜铁蛋！在移动应用开发领域，Flutter以其高效、跨平台的特性吸引了众多开发者的关注。然而，在使用Flutter进行项目开发时，开发者可能会遇到各种问题，其中之一就是运行flutterdoctor命令时长时间未响应。今天铁蛋将深入探讨这一问题的成因、解决方案以及相关的Flutter环境配置知识。一、Flutter与flutterdoctor命令简介Flutter是Goog
  • 【鸿蒙HarmonyOS开发笔记】ArkUI常用组件介绍汇总（更新中） 温、 鸿蒙HarmonyOS开发笔记学习记录harmonyos笔记华为
    概述此文总结开发中用到的一些常用组件，便于查阅，此文持续更新，闲的没事就更线性布局（Row/Column）不多介绍了，最常用的布局组件，两者除了方向不一样，别的都一样方便起见下面只写Column常用属性排列方向上的间距：spaceColumn({space:20}){Row().width('90%').height(50).backgroundColor(0xF5DEB3)Row().width
  • python清华大学出版社答案_Python机器学习及实践 weixin_39805119 python清华大学出版社答案
    第1章机器学习的基础知识1.1何谓机器学习1.1.1传感器和海量数据1.1.2机器学习的重要性1.1.3机器学习的表现1.1.4机器学习的主要任务1.1.5选择合适的算法1.1.6机器学习程序的步骤1.2综合分类1.3推荐系统和深度学习1.3.1推荐系统1.3.2深度学习1.4何为Python1.4.1使用Python软件的由来1.4.2为什么使用Python1.4.3Python设计定位1.4.
  • 沟通管理和相关方管理核心考点梳理 WorkLee PMPPMP沟通管理相关方干系人
    个人总结，仅供参考，欢迎加好友一起讨论PMP-沟通管理和相关方管理核心考点梳理沟通管理和相关方（干系人）管理这两章放在一起进行梳理，这两章很多的考点很容易混淆，经常会纠结于一些题目，究竟选择沟通管理还是干系人管理的知识点。沟通管理1）规划沟通管理沟通在PMP中是指信息流的传递，PM是根据谁的需求来确定这种信息流的传递方式、频率，内容、格式呢？解析：规划沟通管理是基于每个相关方或相关方群体的信息需求
  • 数据管理知识体系指南（第二版）-第五章——数据建模和设计-学习笔记 键盘上的五花肉 数据治理数据库数据仓库数据治理
    目录5.1引言5.1.1业务驱动因素5.1.2目标和原则5.1.3基本概念5.2活动5.2.1规划数据建模5.2.2建立数据模型5.2.3审核数据模型5.2.4维护数据模型5.3工具5.3.1数据建模工具5.3.2数据血缘工具5.3.3数据分析工具5.3.4元数据资料库5.3.5数据模型模式5.3.6行业数据模型5.4方法5.4.1命名约定的最佳实践5.4.2数据库设计中的最佳实践5.5数据建模和
  • 保持好奇心，约束注意力 飞巴
    一、快人一步不是运气任何新知识、新方向都不会一开始就闹得沸沸扬扬、人尽皆知，通常善于发现新机遇、新方向的人并不是瞎猫碰着死耗子，可能在一个项目成功之前，他已经尝试过四五次新方向了。保持好奇心，保持对周围事物的敏感度，才有可能发现机会。举一个美国投资大师彼得林奇的例子，他投资的一些大牛股是在陪夫人逛超市的过程中发现，他说：家庭主妇在超级市场或百货商场选购商品时，最有资格发掘好的消费类股票。当然整个投
  • Numpy、Pandas库的使用 貮叁 量化投资分析pythonpython数据分析
    目录Numpy1、概述2、基础操作2.1生成一个numpy的array数组：2.2自定义一个新的数据类型：np.dtype()3、并行化思想4、量化分析应用4.1索引选取和切片选择4.2数据转换与规整4.3逻辑条件进行数据筛选4.4通用序列函数4.5文件保存与读取Pandas1、简介2、Series和DataFrame的使用2.1Series2.2DataFrame3、量化分析应用3.1形成一个p
  • 冷门知识 | 大雪冻skr个人，知道其中三条冷知识温暖整个冬天~ 带你玩儿
    今日大雪今日节气——大雪，可是并没有下雪。“嗷~~冻死了”“啊~好冷啊”办公室里的伙伴们一进门都是出奇的一致好吧，那今天的冷知识，就让小八给大家来送些温暖吧~温暖整个冬天的冷知识其实喝酒不能暖身子喝酒只会降低身体内部温度，增加患上低体温症的风险，喝酒也会阻断身体自然颤抖保暖的机制。之所以喝酒会感觉暖暖的，因为酒精让血管扩张，将温暖的血液带到体表。所以喝酒带来的暖是暂时的，最后反而会大大降低身体抵抗
  • 计算机网络知识点汇总 蓝小俊
    第1章概述P36习题3、7、14、15、17、22、24、262.“协议”与“服务”的异同点？答：（1）协议是控制两个对等实体进行通信的规则的集合。在协议的控制下，两个对等实体间的通信使得本层能够向上一层提供服务，而要实现本层协议，还需要使用下面一层提供服务。（2）协议和服务的概念的区分：1、协议的实现保证了能够向上一层提供服务。本层的服务用户只能看见服务而无法看见下面的协议。下面的协议对上面的服
  • 记录2022-05-15 果果圆
    计划坚持周更，去记录生活。上周计划：①坚持练字5天，每天至少20min；②学习新内容，通过实践回顾曾学知识；③做运动，5天。④每天背单词。完成度：①练字2/5；②学习进度还不错；③运动3/5；④单词6/7。加入了一个单词小组，队友和我每天都按时打卡的情况下，APP给出的当日奖励会更高，并且最终可以瓜分奖池（奖池指的不是money哦，是APP上的一种虚拟币），当然如果有人两次没打卡，整个队伍也会失去
  • Java回溯知识点（含面试大厂题和源码） 一成码农 java面试开发语言
    回溯算法是一种通过遍历所有可能的候选解来寻找所有解的算法，如果候选解被确认不是一个解（或至少不是最后一个解），回溯算法会通过在上一步进行一些变化来丢弃这个解，即“回溯”并尝试另一个候选解。回溯法通常用递归方法来实现，在解决排列、组合、选择问题时非常有效。回溯算法的核心要点：路径：也就是已经做出的选择。选择列表：也就是你当前可以做的选择。结束条件：也就是到达决策树底层，无法再做出选择的条件。回溯算法
  • Azkaban各种类型的Job编写 __元昊__
    一、概述原生的Azkaban支持的plugin类型有以下这些：command：Linuxshell命令行任务gobblin：通用数据采集工具hadoopJava：运行hadoopMR任务java：原生java任务hive：支持执行hiveSQLpig：pig脚本任务spark：spark任务hdfsToTeradata：把数据从hdfs导入TeradatateradataToHdfs：把数据从Te
  • Java面试题：解释JVM的内存结构，并描述堆、栈、方法区在内存结构中的角色和作用，Java中的多线程是如何实现的，Java垃圾回收机制的基本原理，并讨论常见的垃圾回收算法 杰哥在此 Java系列javajvm算法面试
    Java内存模型与多线程的深入探讨在Java的世界里，内存模型和多线程是开发者必须掌握的核心知识点。它们不仅关系到程序的性能和稳定性，还直接影响到系统的可扩展性和可靠性。下面，我将通过三个面试题，带领大家深入理解Java内存模型、多线程以及并发编程的相关原理和实践。面试题一：请解释JVM的内存结构，并描述堆、栈、方法区在内存结构中的角色和作用。关注点：JVM内存结构的基本组成堆、栈、方法区的功能和
  • 《外观模式（极简c++）》 Bovinitwo 设计模式（极简c++版）c++开发语言
    本文章属于专栏-概述-《设计模式（极简c++版）》-CSDN博客模式说明方案：外观模式提供了一个统一的接口，简化了一组复杂子系统的访问方式。优点：将客户端与子系统解耦，降低了复杂性。提高了代码的灵活性和可维护性。缺点：可能导致外观类过于庞大，承担了过多的责任。增加了系统的抽象层，有时会影响性能。本质思想：外观模式的本质思想是为一组复杂的子系统提供一个简单的接口，隐藏其复杂性，使得客户端可以更轻松地
  • 牛郎织女罗曼史 潮汐_d5d4
    牛郎织女是我国四大民间传说之一，牛郎织女的爱情故事家喻户晓，对他们的真挚感情热情讴歌。那么牛郎和织女是怎么走到一起的呢？单身阶段北斗九星牛郎织女起源于天文，诗经中出现了银河和织女、牵牛星宿，但尚未形成传说故事，还没有后来的情节，这个时候牛郎和织女还是单身。河南郑州青台遗址--陶罐北斗九星天文遗迹，说明5000多年前先民就对天文进行了细致的观察，具备了一定的天文知识，并将观察的结果应用到生活场景中。
  • OpenCV（一个C++人工智能领域重要开源基础库） 简介 愚梦者 OpenCV人工智能人工智能opencvc++图像处理计算机视觉开源
    返回：OpenCV系列文章目录（持续更新中......）上一篇：OpenCV4.9.0配置选项参考下一篇：OpenCV4.9.0开源计算机视觉库安装概述引言：OpenCV（全称OpenSourceComputerVisionLibrary）是一个基于开放源代码发行的跨平台计算机视觉库，可以用来进行图像处理、计算机视觉和机器学习等领域的开发。该库由英特尔公司于1999年开始开发，最初是为了加速处理器
  • 遇见美好｜期待越来越好的自己｜复盘日记Day137 沫ma的1001页
    遇见美好｜期待越来越好的自己｜复盘日记Day1372021年7月21日星期三晴喜马拉雅(沫沫成长记）亲子共读：Day42阅读学习践行Day.17/21晨间日记Day.17/21昨日晚安：23:02今日早安：05:00早起：Day806❥今日运动｜跑步0Km（未完成）❥今日自我成长｜学习新知识1.听书＋书写笔记,小花生阅读打卡2..阅读学习，听音频＋写作业3.时间管理2.0线上践行，听课+写作业4.
  • 人情社会，这些心理学知识你了解吗？ 小书精
    1首因效应首因效应说的就是初次印象的重要性。心理学有个关于第一印象的7/38/55定律，一个人留给他人第一印象，说话内容占7%，说话方式（语速，语调，音量等）占38%，非语言信息（面部表情，行为，服饰等）占55%,，可见人的外在信息是给他人的印象占举足轻重的份量。2肢体语言人与人在交流沟通时，即使不说话，都可以根据对方的身体语言来探索他内心的秘密，对方也会从我们的身体表现来了解我们的真实想法。可谓
  • 26/100参加二一设计线下课程前的一点思考 设计师周文斌
    再过两天就要参加21设计线下的课程了，对此很兴奋也很期待。平时很少参加线下课程，一来费用高花费的时间场成本肯定是非常大的，首先学费是6000再加上机票1500住宿1000吃饭500左右，就是总共8000元，这些年参加的线下课程也很多，但真正能落地，或者说是有实际行动的却是少之又少，所以这次线下课程是怀着一个学习的心态能落地的心态去参加的。因此要让知识课程学有所值，就一定要全新的投入进去。实习的目的
  • 【0719+0720复盘】 沙皮狗的快乐
    时间执行上的有点差，没有按照正常的安排去落地，好多事都乱了顺序去进行了。一个月了，都是各自忙自己的事，没有特别的去打扰对方的工作事情，嗯，生活自由？不是，都是为了想让彼此的对方更好，她的成长是彼此间成长的动力。小火炉就是扮演这样的角色。利他这个利他，不管是多大的事多大的知识点，有学到好的知识点，就去分享给周边有需要的或者没需要的小伙伴，这样的事不止一次两次见到过，小逸身上有，公司整个团队身上也有。
  • Java学习笔记04：Java_数组 JasonYangQ Javajava
    文章目录1.数组1.1数组介绍1.2数组的定义格式1.2.1第一种格式1.2.2第二种格式1.3数组的动态初始化1.3.1什么是动态初始化1.3.2动态初始化格式1.3.3动态初始化格式详解1.4数组元素访问1.4.1什么是索引1.4.2访问数组元素格式1.4.3示例代码1.5内存分配1.5.1内存概述1.5.2java中的内存分配1.9数组的静态初始化1.9.1什么是静态初始化1.9.2静态初始
  • 计算机网络复试总结（五） interee 面试计算机网络
    可能会问：基础知识问题：请简述TCP/IP协议栈的层次结构及其功能。TCP/IP协议栈的层次结构及其功能可以简要概述如下：层次结构：TCP/IP协议栈通常被划分为四个主要层次，从底层到高层分别是网络接口层（也称为链路层或数据链路层）、网络层（也称为网际网层）、传输层和应用层。这四个层次协同工作，实现数据的封装、传输和解析，从而完成网络通信任务。功能概述：网络接口层：这是TCP/IP协议栈的最底层，
  • 【设计模式】Java 设计模式之桥接模式（Bridge） 新手村长 Java设计模式设计模式java桥接模式
    桥接模式（BridgePattern）是结构型设计模式的一种，它主要解决的是抽象部分与实现部分的解耦问题，使得两者可以独立变化。这种类型的设计模式属于结构型模式，因为该模式涉及如何组合接口和它们的实现。将抽象部分与实现部分分离，使它们都可以独立地变化。一、桥接模式概述桥接模式的主要思想是将抽象与实现进行解耦，使得二者可以独立进行变化。在桥接模式中，抽象部分和实现部分被分离出来，抽象部分定义了一个抽
  • 遍历dom 并且存储（将每一层的DOM元素存在数组中） 换个号韩国红果果 JavaScripthtml
    数组从0开始！！ var a=[],i=0; for(var j=0;j<30;j++){ a[j]=[];//数组里套数组，且第i层存储在第a[i]中 } function walkDOM(n){ do{ if(n.nodeType!==3)//筛选去除#text类型 a[i].push(n); //con
  • Android+Jquery Mobile学习系列(9)-总结和代码分享 白糖_ JQuery Mobile
    目录导航   经过一个多月的边学习边练手，学会了Android基于Web开发的毛皮，其实开发过程中用Android原生API不是很多，更多的是HTML/Javascript/Css。   个人觉得基于WebView的Jquery Mobile开发有以下优点： 1、对于刚从Java Web转型过来的同学非常适合，只要懂得HTML开发就可以上手做事。 2、jquerym
  • impala参考资料 dayutianfei impala
    记录一些有用的Impala资料   1. 入门资料 >>官网翻译：     http://my.oschina.net/weiqingbin/blog?catalog=423691   2. 实用进阶 >>代码&架构分析：     Impala/Hive现状分析与前景展望：http
  • JAVA 静态变量与非静态变量初始化顺序之新解 周凡杨 java静态非静态顺序
    今天和同事争论一问题，关于静态变量与非静态变量的初始化顺序，谁先谁后，最终想整理出来！测试代码： import java.util.Map; public class T { public static T t = new T(); private Map map = new HashMap(); public T(){ System.out.println(&quo
  • 跳出iframe返回外层页面 g21121 iframe
    在web开发过程中难免要用到iframe，但当连接超时或跳转到公共页面时就会出现超时页面显示在iframe中，这时我们就需要跳出这个iframe到达一个公共页面去。 首先跳转到一个中间页，这个页面用于判断是否在iframe中，在页面加载的过程中调用如下代码： <script type="text/javascript"> //<!-- function
  • JAVA多线程监听JMS、MQ队列 510888780 java多线程
    背景：消息队列中有非常多的消息需要处理，并且监听器onMessage（）方法中的业务逻辑也相对比较复杂，为了加快队列消息的读取、处理速度。可以通过加快读取速度和加快处理速度来考虑。因此从这两个方面都使用多线程来处理。对于消息处理的业务处理逻辑用线程池来做。对于加快消息监听读取速度可以使用1.使用多个监听器监听一个队列；2.使用一个监听器开启多线程监听。 对于上面提到的方法2使用一个监听器开启多线
  • 第一个SpringMvc例子 布衣凌宇 spring mvc
    第一步：导入需要的包； 第二步：配置web.xml文件 <?xml version="1.0" encoding="UTF-8"?> <web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi=
  • 我的spring学习笔记15-容器扩展点之PropertyOverrideConfigurer aijuans Spring3
    PropertyOverrideConfigurer类似于PropertyPlaceholderConfigurer，但是与后者相比，前者对于bean属性可以有缺省值或者根本没有值。也就是说如果properties文件中没有某个bean属性的内容，那么将使用上下文（配置的xml文件）中相应定义的值。如果properties文件中有bean属性的内容，那么就用properties文件中的值来代替上下
  • 通过XSD验证XML antlove xmlschemaxsdvalidationSchemaFactory
    1. XmlValidation.java package xml.validation; import java.io.InputStream; import javax.xml.XMLConstants; import javax.xml.transform.stream.StreamSource; import javax.xml.validation.Schem
  • 文本流与字符集 百合不是茶 PrintWrite()的使用字符集名字 别名获取
    文本数据的输入输出;           输入;数据流,缓冲流         输出;介绍向文本打印格式化的输出PrintWrite();   package 文本流; import java.io.FileNotFound
  • ibatis模糊查询sqlmap-mapping-**.xml配置 bijian1013 ibatis
            正常我们写ibatis的sqlmap-mapping-*.xml文件时，传入的参数都用##标识，如下所示： <resultMap id="personInfo" class="com.bijian.study.dto.PersonDTO"> <res
  • java jvm常用命令工具——jdb命令(The Java Debugger) bijian1013 javajvmjdb
            用来对core文件和正在运行的Java进程进行实时地调试，里面包含了丰富的命令帮助您进行调试，它的功能和Sun studio里面所带的dbx非常相似，但 jdb是专门用来针对Java应用程序的。         现在应该说日常的开发中很少用到JDB了，因为现在的IDE已经帮我们封装好了，如使用ECLI
  • 【Spring框架二】Spring常用注解之Component、Repository、Service和Controller注解 bit1129 controller
    在Spring常用注解第一步部分【Spring框架一】Spring常用注解之Autowired和Resource注解（http://bit1129.iteye.com/blog/2114084）中介绍了Autowired和Resource两个注解的功能，它们用于将依赖根据名称或者类型进行自动的注入，这简化了在XML中，依赖注入部分的XML的编写，但是UserDao和UserService两个bea
  • cxf wsdl2java生成代码super出错,构造函数不匹配 bitray super
        由于过去对于soap协议的cxf接触的不是很多,所以遇到了也是迷糊了一会.后来经过查找资料才得以解决. 初始原因一般是由于jaxws2.2规范和jdk6及以上不兼容导致的.所以要强制降为jaxws2.1进行编译生成.我们需要少量的修改: 我们原来的代码 wsdl2java com.test.xxx -client http://..... 修改后的代
  • 动态页面正文部分中文乱码排障一例 ronin47
    公司网站一部分动态页面，早先使用apache+resin的架构运行，考虑到高并发访问下的响应性能问题，在前不久逐步开始用nginx替换掉了apache。 不过随后发现了一个问题，随意进入某一有分页的网页，第一页是正常的（因为静态化过了）；点“下一页”，出来的页面两边正常，中间部分的标题、关键字等也正常，唯独每个标题下的正文无法正常显示。 因为有做过系统调整，所以第一反应就是新上
  • java-54- 调整数组顺序使奇数位于偶数前面 bylijinnan java
    import java.util.Arrays; import java.util.Random; import ljn.help.Helper; public class OddBeforeEven { /** * Q 54 调整数组顺序使奇数位于偶数前面 * 输入一个整数数组，调整数组中数字的顺序，使得所有奇数位于数组的前半部分，所有偶数位于数组的后半
  • 从100PV到1亿级PV网站架构演变 cfyme 网站架构
    一个网站就像一个人，存在一个从小到大的过程。养一个网站和养一个人一样，不同时期需要不同的方法，不同的方法下有共同的原则。本文结合我自已14年网站人的经历记录一些架构演变中的体会。 1：积累是必不可少的 架构师不是一天练成的。 1999年，我作了一个个人主页，在学校内的虚拟空间，参加了一次主页大赛，几个DREAMWEAVER的页面，几个TABLE作布局，一个DB连接，几行PHP的代码嵌入在HTM
  • [宇宙时代]宇宙时代的GIS是什么？ comsci Gis
           我们都知道一个事实，在行星内部的时候，因为地理信息的坐标都是相对固定的，所以我们获取一组GIS数据之后，就可以存储到硬盘中，长久使用。。。但是，请注意，这种经验在宇宙时代是不能够被继续使用的          宇宙是一个高维时空
  • 详解create database命令 czmmiao database
    完整命令 CREATE DATABASE mynewdb   USER SYS IDENTIFIED BY sys_password   USER SYSTEM IDENTIFIED BY system_password   LOGFILE GROUP 1 ('/u01/logs/my/redo01a.log','/u02/logs/m
  • 几句不中听却不得不认可的话 datageek
    1、人丑就该多读书。 2、你不快乐是因为：你可以像猪一样懒，却无法像只猪一样懒得心安理得。 3、如果你太在意别人的看法，那么你的生活将变成一件裤衩，别人放什么屁，你都得接着。 4、你的问题主要在于：读书不多而买书太多，读书太少又特爱思考，还他妈话痨。 5、与禽兽搏斗的三种结局：(1)、赢了，比禽兽还禽兽。(2)、输了，禽兽不如。(3)、平了，跟禽兽没两样。结论：选择正确的对手很重要。 6
  • 1 14:00 PHP中的“syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM”错误 dcj3sjt126com PHP
    原文地址：http://www.kafka0102.com/2010/08/281.html   因为需要，今天晚些在本机使用PHP做些测试，PHP脚本依赖了一堆我也不清楚做什么用的库。结果一跑起来，就报出类似下面的错误：“Parse error: syntax error, unexpected T_PAAMAYIM_NEKUDOTAYIM in /home/kafka/test/
  • xcode6 Auto layout and size classes dcj3sjt126com ios
    官方GUI   https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/AutolayoutPG/Introduction/Introduction.html   iOS中使用自动布局（一）   http://www.cocoachina.com/ind
  • 通过PreparedStatement批量执行sql语句【sql语句相同，值不同】 梦见x光 sql事务批量执行
    比如说：我有一个List需要添加到数据库中，那么我该如何通过PreparedStatement来操作呢？ public void addCustomerByCommit(Connection conn , List<Customer> customerList) {    String sql = "inseret into customer(id
  • 程序员必知必会----linux常用命令之十【系统相关】 hanqunfeng Linux常用命令
    一.linux快捷键 Ctrl+C : 终止当前命令 Ctrl+S : 暂停屏幕输出 Ctrl+Q : 恢复屏幕输出 Ctrl+U : 删除当前行光标前的所有字符 Ctrl+Z : 挂起当前正在执行的进程 Ctrl+L : 清除终端屏幕，相当于clear   二.终端命令 clear : 清除终端屏幕 reset : 重置视窗，当屏幕编码混乱时使用 time com
  • NGINX IXHONG nginx
    pcre 编译安装 nginx conf/vhost/test.conf   upstream admin { server 127.0.0.1:8080; }   server {                 listen       80; &
  • 设计模式--工厂模式 kerryg 设计模式
    工厂方式模式分为三种：   1、普通工厂模式：建立一个工厂类，对实现了同一个接口的一些类进行实例的创建。   2、多个工厂方法的模式：就是对普通工厂方法模式的改进，在普通工厂方法模式中，如果传递的字符串出错，则不能正确创建对象，而多个工厂方法模式就是提供多个工厂方法，分别创建对象。   3、静态工厂方法模式：就是将上面的多个工厂方法模式里的方法置为静态，
  • Spring InitializingBean/init-method和DisposableBean/destroy-method mx_xiehd javaspringbeanxml
    1.initializingBean/init-method 实现org.springframework.beans.factory.InitializingBean接口允许一个bean在它的所有必须属性被BeanFactory设置后，来执行初始化的工作，InitialzingBean仅仅指定了一个方法。 通常InitializingBean接口的使用是能够被避免的，（不鼓励使用，因为没有必要
  • 解决Centos下vim粘贴内容格式混乱问题 qindongliang1922 centosvim
    有时候，我们在向vim打开的一个xml，或者任意文件中，拷贝粘贴的代码时，格式莫名其毛的就混乱了，然后自己一个个再重新，把格式排列好，非常耗时，而且很不爽，那么有没有办法避免呢？ 答案是肯定的，设置下缩进格式就可以了，非常简单： 在用户的根目录下 直接vi  ~/.vimrc文件 然后将set pastetoggle=<F9> 写入这个文件中，保存退出，重新登录，
  • netty大并发请求问题 tianzhihehe netty
    多线程并发使用同一个channel java.nio.BufferOverflowException: null at java.nio.HeapByteBuffer.put(HeapByteBuffer.java:183) ~[na:1.7.0_60-ea] at java.nio.ByteBuffer.put(ByteBuffer.java:832) ~[na:1.7.0_60-ea]
  • Hadoop NameNode单点问题解决方案之一 AvatarNode wyz2009107220 NameNode
    我们遇到的情况 Hadoop NameNode存在单点问题。这个问题会影响分布式平台24*7运行。先说说我们的情况吧。 我们的团队负责管理一个1200节点的集群(总大小12PB)，目前是运行版本为Hadoop 0.20，transaction logs写入一个共享的NFS filer(注：NetApp NFS Filer)。 经常遇到需要中断服务的问题是给hadoop打补丁。 DataNod