欣慰的三叶草(●￣(ｴ)￣●)
欣慰的三叶草(●￣(ｴ)￣●)

03_歌词滚动效果

03_歌词滚动效果

文章目录

  • 03_歌词滚动效果
  • 效果
  • 一、数据准备
    • ①：歌词
    • ②：音频等
  • 二、代码实现
    • ①：首页
    • ②：样式
    • ③：js逻辑
    • ④：测试

效果

03_歌词滚动效果_第1张图片

一、数据准备

①：歌词

var lrc = `[00:00.95]夜微凉 - 徐珊
[00:01.9]词：周敏君/徐珊
[00:02.85]曲：秦天
[00:03.8]编曲：秦天
[00:04.75]制作人：秦天
[00:05.7]配唱制作人：孙依哲/李少成
[00:06.65]制作统筹：宋双喜
[00:07.6]财务及行政协力：周美军/赵杨
[00:08.55]监制：吕军/张斌/柴奇/古国远
[00:09.5]出品人：侯俊/张健
[00:10.45]出品监制：秦朗
[00:11.4]艺人经纪：徐真真
[00:12.35]封面设计：LDG
[00:13.35]夜微凉
[00:15.72]灯微暗
[00:18.12]远处的你
[00:19.62]却如此温暖
[00:22.92]如果再没有什么
[00:25.29]结果是我相信你
[00:27.99]会使
[00:29.22]我更加心安
[00:34.59]拥抱世界美丽
[00:37.02]此刻我想拥抱你
[00:39.42]如果再没有什么
[00:41.46]结果是我相信你
[00:44.22]会使我心
[00:45.54]更安静
[00:47.22]遇到烦心
[00:48.99]放于时间里慢慢说给你听
[00:57.42]会让你走出凹凸地 平线
[01:00.99]因为这自信
[01:02.85]让我更加情愿
[01:06.99]道路总是走走停停
[01:10.86]只是你还心有不安
[01:15.45]遇到烦心
[01:17.01]因为我不想让你看到
[01:20.22]看到我忧伤的表情
[01:24.99]放于时间里
[01:27.39]慢慢的说给你听
[01:30.09]稀释忧愁
[01:31.89]面对不安
[01:36.990005]拥抱世界美丽
[01:39.42]此刻我想拥抱你
[01:41.85]如果再没有什么
[01:43.86]结果是我相信你
[01:46.619995]会使我心
[01:47.94]更安静
[01:49.65]遇到烦心
[01:51.39]放于时间里慢慢说给你
[01:57.509995]夜微凉
[01:58.92]灯微暗
[02:01.29]远处的你
[02:02.79]却如此温暖
[02:06.06]如果再没有什么
[02:08.46]结果是我相信你
[02:11.22]会使
[02:12.42]我更加心安
[02:15.45]遇到烦心
[02:17.01]因为我不想让你看到
[02:20.22]看到我忧伤的表情
[02:24.95999]放于时间里
[02:27.39]慢慢的说给你听
[02:30.06]稀释忧愁
[02:31.89]面对不安
[02:34.59]拥抱世界美丽
[02:36.99]此刻我想拥抱你
[02:39.45]如果再没有什么
[02:41.45999]结果是我相信你
[02:44.22]会使我心
[02:45.54001]更安静
[02:47.22]遇到烦心
[02:48.99]放于时间里慢慢说给你听`

03_歌词滚动效果_第2张图片

②：音频等

  • 资源在文章的顶部绑定
    03_歌词滚动效果_第3张图片

二、代码实现

03_歌词滚动效果_第4张图片

①：首页

DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>歌词滚动效果title>
    <link rel="shortcut icon" href="./assets/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/index.css">
head>
<body>
<audio controls src="./assets/夜微凉.mp3">audio>
<div class="container">
    <ul class="lrc-list">
    ul>
div>
<script src="./js/data.js">script>
<script src="./js/index.js">script>

body>
html>

②：样式

* {
    padding: 0;
    margin: 0;
}
body{
    background-color: black;
    color: #666;
    text-align: center;
}
audio{
    width: 450px;
    height: 50px;
    margin: 30px 0;
}
.container{
    height: 420px;
    overflow: hidden;
}
.container ul{
    transition: 0.5s;
    list-style: none;
}
.container li{
    height: 30px;
    line-height: 30px;
    transition: 0.2s;
}
.container .lrc-list .active{
    color: #fff;
    transform: scale(1.3);
}

③：js逻辑

/**
 * 解析歌词字符串 得到每个歌词的对象
 * {time: 开始时间, words: 歌词内容}
 */
var lrcArray = [];

function parseLrc() {
    let lines = lrc.split("\n");
    lines.forEach(item => {
        let parts = item.split("]");
        var timeStr = parts[0].substr(1);
        let time = parseTime(timeStr);
        var obj = {
            time: time,
            words: parts[1]
        }
        lrcArray.push(obj);
    })
    return lrcArray;
}

/**
 * 获取需要的dom
 */
var dom = {
    audio: document.querySelector("audio"),
    ul: document.querySelector('.container ul'),
    container: document.querySelector('.container'),
}

/**
 * 将字符串转成时间数字 01:02.85 ==> 1*60 + 2.85（秒）
 * @param timeStr 时间字符串
 */
function parseTime(timeStr) {
    let split = timeStr.split(":");
    return +split[0] * 60 + +split[1]
}

/**
 * 计算出，在当前播放器播放到几秒的情况下
 * lrcArray 数组中 应该高亮显示的歌词下标
 * -1 没有任何一句歌词需要显示
 */
function findIndex() {
    // 播放器当前时间
    let time = dom.audio.currentTime;
    for (let i = 0; i < lrcArray.length; i++) {
        if (lrcArray[i].time > time) {
            return i - 1
        }
    }
    // 如果大于最后一句歌词时间 显示最后一句歌词
    return lrcArray.length - 1
}

console.log(parseLrc());


/**
 * 创建歌词元素 li
 */
function createLrcElements(){
    lrcArray.forEach(item =>{
        var li = document.createElement("li");
        li.textContent = item.words
        dom.ul.appendChild(li)
    })
}
createLrcElements()

// 容器的高度
let containerHeight = dom.container.clientHeight;
// 每一个li的高度
let liHeight = dom.ul.children[0].clientHeight;
// 最大便宜量
let max = dom.ul.clientHeight - containerHeight;

/**
 * 设置ul的偏移量
 */
function setOffset() {
    let index = findIndex();
    let h1 = liHeight * index + liHeight / 2 - containerHeight / 2
    if (h1 < 0){
        h1 = 0
    }
    if (h1 > max){
        h1 = max
    }
    // 去掉之前的 active 样式
    let li = dom.ul.querySelector('.active');
    if (li){
        li.classList.remove('active')
    }

    dom.ul.style.transform = `translateY(-${h1}px)`
    li = dom.ul.children[index];
    if (li){
        li.classList.add('active')
    }
}
dom.audio.addEventListener('timeupdate', () => setOffset())

④：测试

03_歌词滚动效果_第5张图片

你可能感兴趣的:(WEB前端,#,WEB前端大师课,前端)

  • Long类型前后端数据不一致 igotyback 前端
    响应给前端的数据浏览器控制台中response中看到的Long类型的数据是正常的到前端数据不一致前后端数据类型不匹配是一个常见问题，尤其是当后端使用Java的Long类型（64位）与前端JavaScript的Number类型（最大安全整数为2^53-1，即16位）进行数据交互时，很容易出现精度丢失的问题。这是因为JavaScript中的Number类型无法安全地表示超过16位的整数。为了解决这个问
  • 三大师传 beca酱
    巴尔扎克的作品被誉为“法国社会的一面镜子”。文学大师维克多·雨果对巴尔扎克的评价是：“在最伟大的人物中间，巴尔扎克是名列前茅者；在最优秀的人物中间，巴尔扎克是佼佼者之一。”一个原本寂寂无名的小人物，从地中海的某个海岛上，只身一人来到巴黎，没有朋友，也没有名望。作为一个一文不名的外乡人，凭着赤手空拳赢得了巴黎，征服了整个法兰西，并且赢得了世界。这个人就是十九世纪法国伟大的军事家、政治家，法兰西第一帝
  • 四章-32-点要素的聚合 彩云飘过
    本文基于腾讯课堂老胡的课《跟我学Openlayers--基础实例详解》做的学习笔记，使用的openlayers5.3.xapi。源码见1032.html，对应的官网示例https://openlayers.org/en/latest/examples/cluster.htmlhttps://openlayers.org/en/latest/examples/earthquake-clusters.
  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 【加密社】Solidity 中的事件机制及其应用 加密社 闲侃区块链智能合约区块链
    加密社引言在Solidity合约开发过程中，事件（Events）是一种非常重要的机制。它们不仅能够让开发者记录智能合约的重要状态变更，还能够让外部系统（如前端应用）监听这些状态的变化。本文将详细介绍Solidity中的事件机制以及如何利用不同的手段来触发、监听和获取这些事件。事件存储的地方当我们在Solidity合约中使用emit关键字触发事件时，该事件会被记录在区块链的交易收据中。具体而言，事件
  • 关于城市旅游的HTML网页设计——(旅游风景云南 5页)HTML+CSS+JavaScript 二挡起步 web前端期末大作业javascripthtmlcss旅游风景
    ⛵源码获取文末联系✈Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业|游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作|HTML期末大学生网页设计作业，Web大学生网页HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScrip
  • HTML网页设计制作大作业（div+css） 云南我的家乡旅游景点 带文字滚动 二挡起步 web前端期末大作业web设计网页规划与设计htmlcssjavascriptdreamweaver前端
    Web前端开发技术描述网页设计题材，DIV+CSS布局制作,HTML+CSS网页设计期末课程大作业游景点介绍|旅游风景区|家乡介绍|等网站的设计与制作HTML期末大学生网页设计作业HTML：结构CSS：样式在操作方面上运用了html5和css3，采用了div+css结构、表单、超链接、浮动、绝对定位、相对定位、字体样式、引用视频等基础知识JavaScript：做与用户的交互行为文章目录前端学习路线
  • 阶段总结反思 轻争
    马上就要进入10月份了，今天做一下前段时间的总结和反思。前段时间，日更、英语、健身、护肤坚持的比较好。阅读、书法坚持的不好。1.中间被迫停更半个多月，其余时间一直在坚持日更挑战。偶尔也有不想写的时候，就做一下摘抄。因为阅读（输入）没跟上来，所以写作（输出）质量有待进一步加强。2.英语做到了一周至少学习5天，每次不少于30分钟，但是小班课没有跟上更新速度，下一步要争取利用零碎时间补听小班课。3.减肥
  • 如何成为段子手 欣雅阅读
    我是一个尬聊大师，与朋友聊天经常把话题聊死，留我一个人在群里，望着自己打下的最后一句话无语凝噎。看到风趣幽默的朋友与人聊天，很是艳羡，觉得自己何时才能成为这样的段子手呢？一、段子是什么？“段子”一词在百度百科上的解释：本是相声中的一个艺术术语，指的是相声作品中一节或一段艺术内容。我的理解：段子就是一些搞笑的故事或者笑话。二、为什么要会说段子？不知道大家有没有这样的朋友，本来很无趣的聚会，只要有他参
  • C++菜鸟教程 - 从入门到精通 第二节 DreamByte c++
    一.上节课的补充(数据类型)1.前言继上节课,我们主要讲解了输入,输出和运算符,我们现在来补充一下数据类型的知识上节课遗漏了这个知识点,非常的抱歉顺便说一下,博主要上高中了,更新会慢,2-4周更新一次对了,正好赶上中秋节,小编跟大家说一句:中秋节快乐!2.int类型上节课,我们其实只用了int类型int类型,是整数类型,它们存贮的是整数,不能存小数(浮点数)定义变量的方式很简单inta;//定义一
  • 2019-3-23晨间日记 红红火火小耳朵
    今天是什么日子起床：7点40就寝：23点半天气：有太阳，不过一会儿出来一会儿进去特别清爽的凉意，还蛮舒服的心情：小激动要给女朋友过生日啦纪念日：田田女士过生日任务清单昨日完成的任务，最重要的三件事：1.英语一对一2.运动计划3.认真护肤习惯养成：调整状态周目标·完成进度英语七天打卡（5/7）轻课阅读（87/180）音标课（25/30）读书（福尔摩斯一章）学习·信息·阅读#英语课#Cookingte
  • 提高教师信息素养，提高道德与法治课教学效益 长白159宋彦红
    提高教师信息素养，提高道德与法治课教学效益随着经济和社会的发展，信息技术已经运用到课堂教学中，为课堂教学展示了一个崭新的天地。的确，信息技术形象、生动、直观性强，能够将课本中的一些抽想的概念直接展示在学生面前，从而调动学生的眼、耳、脑，让他们兴奋起来，变被动学习为主动学习，充分发挥教师的教育引导作用，创造一个可以使学生积极参与的场景。在制作、使用信息技术的实践过程中，本文拟就教师提升信息素养的必要
  • 为什么你总是对下属不满意? ZhaoWu1050
    【ZhaoWu的听课笔记】大多数公司，都存在两种问题。我创业四年，更是体会深切。这两种问题就是：老板经常不满意下属的表现；下属总是不知道老板想要什么；虽然这两种问题普遍存在，其实解决方法并不复杂。这节课，我们再聊聊第一个问题：为什么老板经常不满意下属表现?其实，这背后也是一条管理常识。管理学家德鲁克先生早就说过：管理者的任务，不是去改变人。*来自《卓有成效的管理者》只是大多数老板和我一样，都是一边
  • 随记│开学49日 Silence的小茶馆
    开学四十九天哇，今天还是上了一上午课啦，然后有丢丢升温啦（嘿嘿少穿一件哇，不错不错）然后就是好像可以休息了哈（毕竟到周五了）结果周日还是得上课哇。下午还是就休息哈，想着说学习一会儿，但其实是没有想好究竟是要做啥的，所以就还是有在玩诶，主要也是睡了挺久哇（我的过，我的错）所以明天能改正嘛？然后看完综艺第二季啦，就找到第一季看看哇，很不错啦！但还是得学习啊，毕竟作为学生捏，学习还是最重要哒！恩，今天就
  • 2023-08-08 2023梦启支教团张牧泽
    学汉字历史，行传统书法——中国矿业大学梦启支教团梦启三班开展书法文化课7月20日上午8时，中国矿业大学梦启支教团在贵州省金沙县西洛街道彩虹小学开展了“书法文化”课程。该课程意在向孩子们传授汉字演变的相关知识，围绕书法发展历史讲解不同时期的字形字体特点。此课程由梦启支教团成员王耀民讲授，梦启三班全体成员参加。中国文字的发展有数千年的历史，从早期雏形的象形文字到殷商时期的甲骨文、金文，再到西周、秦朝的
  • 海拔五千 3点8度
    【海拔五千】连续几天到宿舍盯学生早起情况，今天早上都能及时离开宿舍，没有迟到的了。早读复习宋词，新背一首，晚上又忘了[流泪]断续听王静老师的一堂课，深度语文名不虚传！下课问学生如何，学生答曰比你讲的有趣[捂脸]继续读《娱乐至死》美国在不同的历史时期，代表城市不一样，从波士顿的政治中心，到纽约的大熔炉（自由女神就是其象征），再到芝加哥的工业发展中心，最后到拉斯维加斯的娱乐之城。不同历史时期美国精神的
  • 【347】脊梁式普通教师——《教育的100种可能（上）》（5） 向日葵_1f86
    用心是一节课，敷衍也是一节课，但是我们的尽心与否，很可能会改变一个孩子的人生轨迹。——李镇西学生张春银李镇西老师说：张春银不是“全国劳模”“特级教师”，但他真正代表了绝大多数的平凡教师、普通劳动者，这就是我要写张春银的原因。张春银老师是乡村教育的默默守望者，用他的爱守护着每一个孩子，上好每一堂课，用自己的青春去呵护孩子们的快乐成长。因为教育行走，我们也听到了更多乡村教师的故事，他们也都是用自己的爱
  • 2019考研 | 西交大软件工程 笔者阿蓉
    本科背景：某北京211学校电子信息工程互联网开发工作两年录取结果：全日制软件工程学院分数：初试350+复试笔试80+面试85+总排名：100+从五月份开始脱产学习，我主要说一下专业课和复试还有我对非全的一些看法。【数学100+】张宇，张宇，张宇。跟着张宇学习，入门视频刷一遍，真题刷两遍，错题刷三遍。书刷N多遍。从视频开始学习，是最快的学习方法。5-7月份把主要是数学学好，8-9月份开始给自己每个周
  • 2018-12-22 《金刚经修心课：不焦虑的活法》摘录 Cintia1004
    不为外界干扰的神奇力量如果你即将开始阅读金刚经，请试着把你的心空下来，把你各种习惯性的想法放在一边，以一种敞开的心态去阅读它。在敞开的阅读里，你会慢慢领悟到，金刚经没有任何结论，只是一种启迪，一种指引，指引你彻底地自我解放，从一切的成见里解放出来。你会惊奇地发现，金刚经……你都能够获得一种不为外界干扰的平静的力量。当这种力量充满你的日常生活，你会不害怕失败，……没有得到的时候，想要得到；已经得到的
  • Python入门之Lesson2:Python基础语法 小熊同学哦 Python入门课程python开发语言算法数据结构青少年编程
    目录前言一.介绍1.变量和数据类型2.常见运算符3.输入输出4.条件语句5.循环结构二.练习三.总结前言欢迎来到《Python入门》系列博客的第二课。在上一课中，我们了解了Python的安装及运行环境的配置。在这一课中，我们将深入学习Python的基础语法，这是编写Python代码的根基。通过本节内容的学习，你将掌握变量、数据类型、运算符、输入输出、条件语句等Python编程的基础知识。一.介绍1
  • springboot+vue项目实战一-创建SpringBoot简单项目 苹果酱0567 面试题汇总与解析springboot后端java中间件开发语言
    这段时间抽空给女朋友搭建一个个人博客，想着记录一下建站的过程，就当做笔记吧。虽然复制zjblog只要一个小时就可以搞定一个网站，或者用cms系统，三四个小时就可以做出一个前后台都有的网站，而且想做成啥样也都行。但是就是要从新做，自己做的意义不一样，更何况，俺就是专门干这个的，嘿嘿嘿要做一个网站，而且从零开始，首先呢就是技术选型了，经过一番思量决定选择-SpringBoot做后端，前端使用Vue做一
  • 2021-11-18 安安303
    刘红雅中原焦点团队分享第135天筑基第4课社会心理学接上一课，心理现象。需要和动机所有的动机行为受需要的影响，现在的孩子很多方面不需要，是因为得到的太多需要使机体内部不平衡的状态，现在很多需要满足的过多，是“厌”，孩子要越用越有用，没有用到自己，自己没有价值感成就感，他就不需要开发自己的潜力。对自己和孩子的生活留白不断的学习成长，实现自己。所有有情绪的地方是触动了需求，需求没有被满足，当一个人知道
  • 日记 2019年10月15日 杨义博 c487bb976552
    今天是我穿校服的第一天，我很激动，我觉得我正式成为了一名一年级的小学生。中午回家时，我们看向操场发现有些高年级的大哥哥们在一个一个摆这一个有很多种颜色的龙，我们觉得很酷。下午上体育课，体育老师带我们上操场上去跑了一圈，我们看见了高年级哥哥姐姐们在操场上打鼓，还有一个大哥哥从前面拿着一个戴着星星的拐杖，指挥着全队的行动，最后面还有拿着花圈的，还有拿着国旗的。
  • 博客网站制作教程 2401_85194651 javamaven
    首先就是技术框架：后端：Java+SpringBoot数据库：MySQL前端：Vue.js数据库连接：JPA(JavaPersistenceAPI)1.项目结构blog-app/├──backend/│├──src/main/java/com/example/blogapp/││├──BlogApplication.java││├──config/│││└──DatabaseConfig.java
  • 2022-1-12晨间日记 云卷云舒_a1b9
    起床：6：20就寝：23：00天气：阴心情：还好纪念日：法考主观体出分的日子叫我起床的不是闹钟是梦想年度目标及关键点：备考初级会计师；坚持运动，减重，阅读，学习本月重要成果：报名今日三只青蛙/番茄钟学习听课；瑜伽课；记账盘点成功日志-记录三五件有收获的事务1.收到鲜花2.早起做早餐3.引导孩子做计划财务检视支出严重超预算，检视一月的预算是否合理人际的投入同学联系；开卷有益-学习/读书/听书听初级课
  • 小西妈双语工程打卡2018-1-18 慢蜗牛Erica
    这是送给妈妈的，还有一张是爸爸的，现在看着这张小图，觉得好温暖。早上看到了我把它折上了，还好一顿不高兴。妈妈这个是爸爸。爸爸希望之星，Herewecome.复赛通知书这是送给妈妈的小鹿，栩栩如生吧，不过妈妈不确定这是他一个人完成的。还送了妈妈一个小蝴蝶发卡，很暖心哦。小鹿上完课回家就很晚了，自己看了好几本书，没有录阅读打卡。听peppa第一季3集。
  • 寓美于心 琴韵无声
    今天是“语文湿地2021网络年会”第一天。年会早上七点在尹东老师和王君老师的激情开幕致辞中开始。一天下来听了八节课，真是“八仙过海，各显神通。”精彩纷呈。愚笨如我，真的是找不出一个恰切的词来形容她们的美妙绝伦。今天一口气吃下了饕餮盛宴，留待日后慢慢反刍吧。今天的压轴大戏是王君老师的《若爱，深深爱；若写，深情写》——跟《土地的誓言》学意象铺排”艺术。又加上是最后一节听的，印象最为深刻。凭着印象先略记
  • 最简单将静态网页挂载到服务器上(不用nginx) 全能全知者 服务器nginx运维前端html笔记
    最简单将静态网页挂载到服务器上(不用nginx)如果随便弄个静态网页挂在服务器都要用nignx就太麻烦了，所以直接使用Apache来搭建一些简单前端静态网页会相对方便很多检查Web服务器服务状态：sudosystemctlstatushttpd#ApacheWeb服务器如果发现没有安装web服务器：安装Apache：sudoyuminstallhttpd启动Apache：sudosystemctl
  • 补充元象二面 Redstone Monstrosity 前端面试
    1.请尽可能详细地说明，防抖和节流的区别，应用场景？你的回答中不要写出示例代码。防抖（Debounce）和节流（Throttle）是两种常用的前端性能优化技术，它们的主要区别在于如何处理高频事件的触发。以下是防抖和节流的区别和应用场景的详细说明：防抖和节流的定义防抖：在一段时间内，多次执行变为只执行最后一次。防抖的原理是，当事件被触发后，设置一个延迟定时器。如果在这个延迟时间内事件再次被触发，则重
  • 死心眼的家长 Z青青
    今天礼拜一是儿子打篮球的时间，放学回家高高兴兴的把饭吃完了，准备上篮球课，走到门口小卖铺，放学回来时候，孩子想买零食，我同意了说好3元标准，嗯，到了小卖铺他想吃南瓜酥（很上火），我说孩子你嗓子不舒服着的这个不能吃吧，又要可乐我摇头，他又去选，我提醒他快到时间了，生气了不买了，一路上哭我生气把车子停下来，打算好好说说，一停不要紧不去上课了，说他不喜欢篮球，都是我逼他报的。我:孩子我让你考虑了几个月，
  • 312个免费高速HTTP代理IP（能隐藏自己真实IP地址） yangshangchuan 高速免费superwordHTTP代理
        124.88.67.20:843 190.36.223.93:8080 117.147.221.38:8123 122.228.92.103:3128 183.247.211.159:8123 124.88.67.35:81 112.18.51.167:8123 218.28.96.39:3128 49.94.160.198:3128 183.20
  • pull解析和json编码 百合不是茶 androidpull解析json
    n.json文件: [{name:java,lan:c++,age:17},{name:android,lan:java,age:8}]   pull.xml文件 <?xml version="1.0" encoding="utf-8"?> <stu>     <name>java
  • [能源与矿产]石油与地球生态系统 comsci 能源
          按照苏联的科学界的说法,石油并非是远古的生物残骸的演变产物,而是一种可以由某些特殊地质结构和物理条件生产出来的东西,也就是说,石油是可以自增长的....       那么我们做一个猜想: 石油好像是地球的体液,我们地球具有自动产生石油的某种机制,只要我们不过量开采石油,并保护好
  • 类与对象浅谈 沐刃青蛟 java基础
           类，字面理解，便是同一种事物的总称，比如人类，是对世界上所有人的一个总称。而对象，便是类的具体化，实例化，是一个具体事物，比如张飞这个人，就是人类的一个对象。但要注意的是：张飞这个人是对象，而不是张飞，张飞只是他这个人的名字，是他的属性而已。而一个类中包含了属性和方法这两兄弟，他们分别用来描述对象的行为和性质（感觉应该是
  • 新站开始被收录后，我们应该做什么？ IT独行者 PHPseo
    新站开始被收录后，我们应该做什么？         百度终于开始收录自己的网站了，作为站长，你是不是觉得那一刻很有成就感呢，同时，你是不是又很茫然，不知道下一步该做什么了？至少我当初就是这样，在这里和大家一份分享一下新站收录后，我们要做哪些工作。       至于如何让百度快速收录自己的网站，可以参考我之前的帖子《新站让百
  • oracle 连接碰到的问题 文强chu oracle
    Unable to find a java Virtual Machine－－安装64位版Oracle11gR2后无法启动SQLDeveloper的解决方案 作者：草根IT网 来源：未知 人气：813标签： 导读：安装64位版Oracle11gR2后发现启动SQLDeveloper时弹出配置java.exe的路径，找到Oracle自带java.exe后产生的路径“C:\app\用户名\prod
  • Swing中按ctrl键同时移动鼠标拖动组件（类中多借口共享同一数据） 小桔子 java继承swing接口监听
            都知道java中类只能单继承，但可以实现多个接口，但我发现实现多个接口之后，多个接口却不能共享同一个数据，应用开发中想实现：当用户按着ctrl键时，可以用鼠标点击拖动组件，比如说文本框。 编写一个监听实现KeyListener,NouseListener,MouseMotionListener三个接口，重写方法。定义一个全局变量boolea
  • linux常用的命令 aichenglong linux常用命令
    1 startx切换到图形化界面 2 man命令:查看帮助信息 man 需要查看的命令,man命令提供了大量的帮助信息,一般可以分成4个部分 name:对命令的简单说明 synopsis:命令的使用格式说明 description:命令的详细说明信息 options:命令的各项说明 3 date:显示时间 语法：date [OPTION]... [+FORMAT]
  • eclipse内存优化 AILIKES javaeclipsejvmjdk
    一 基本说明      在JVM中，总体上分2块内存区,默认空余堆内存小于 40%时，JVM就会增大堆直到-Xmx的最大限制；空余堆内存大于70%时，JVM会减少堆直到-Xms的最小限制。     1)堆内存(Heap memory):堆是运行时数据区域，所有类实例和数组的内存均从此处分配,是Java代码可及的内存，是留给开发人
  • 关键字的使用探讨 百合不是茶 关键字
    //关键字的使用探讨/*访问关键词private 只能在本类中访问public 只能在本工程中访问protected 只能在包中和子类中访问默认的 只能在包中访问*//*final   类 方法 变量 final 类 不能被继承 final 方法 不能被子类覆盖，但可以继承 final 变量 只能有一次赋值，赋值后不能改变 final 不能用来修饰构造方法*///this()
  • JS中定义对象的几种方式 bijian1013 js
        1. 基于已有对象扩充其对象和方法(只适合于临时的生成一个对象)： <html> <head> <title>基于已有对象扩充其对象和方法(只适合于临时的生成一个对象)</title> </head> <script> var obj = new Object();
  • 表驱动法实例 bijian1013 java表驱动法TDD
    获得月的天数是典型的直接访问驱动表方式的实例，下面我们来展示一下： MonthDaysTest.java package com.study.test; import org.junit.Assert; import org.junit.Test; import com.study.MonthDays; public class MonthDaysTest { @T
  • LInux启停重启常用服务器的脚本 bit1129 linux
    启动，停止和重启常用服务器的Bash脚本，对于每个服务器，需要根据实际的安装路径做相应的修改   #! /bin/bash Servers=(Apache2, Nginx, Resin, Tomcat, Couchbase, SVN, ActiveMQ, Mongo); Ops=(Start, Stop, Restart); currentDir=$(pwd); echo
  • 【HBase六】REST操作HBase bit1129 hbase
    HBase提供了REST风格的服务方便查看HBase集群的信息，以及执行增删改查操作   1. 启动和停止HBase REST 服务 1.1 启动REST服务 前台启动（默认端口号8080） [hadoop@hadoop bin]$ ./hbase rest start   后台启动 hbase-daemon.sh start rest   启动时指定
  • 大话zabbix 3.0设计假设 ronin47
    What’s new in Zabbix 2.0? 去年开始使用Zabbix的时候，是1.8.X的版本，今年Zabbix已经跨入了2.0的时代。看了2.0的release notes，和performance相关的有下面几个：          :: Performance improvements::Trigger related da
  • http错误码大全 byalias http协议javaweb
    响应码由三位十进制数字组成，它们出现在由HTTP服务器发送的响应的第一行。 响应码分五种类型，由它们的第一位数字表示： 1）1xx：信息，请求收到，继续处理 2）2xx：成功，行为被成功地接受、理解和采纳 3）3xx：重定向，为了完成请求，必须进一步执行的动作 4）4xx：客户端错误，请求包含语法错误或者请求无法实现 5）5xx：服务器错误，服务器不能实现一种明显无效的请求
  • J2EE设计模式-Intercepting Filter bylijinnan java设计模式数据结构
    Intercepting Filter类似于职责链模式 有两种实现 其中一种是Filter之间没有联系，全部Filter都存放在FilterChain中，由FilterChain来有序或无序地把把所有Filter调用一遍。没有用到链表这种数据结构。示例如下： package com.ljn.filter.custom; import java.util.ArrayList;
  • 修改jboss端口 chicony jboss
    修改jboss端口   %JBOSS_HOME%\server\{服务实例名}\conf\bindingservice.beans\META-INF\bindings-jboss-beans.xml   中找到 <!-- The ports-default bindings are obtained by taking the base bindin
  • c++ 用类模版实现数组类 CrazyMizzz C++
    最近c++学到数组类，写了代码将他实现，基本具有vector类的功能 #include<iostream> #include<string> #include<cassert> using namespace std; template<class T> class Array { public: //构造函数
  • hadoop dfs.datanode.du.reserved 预留空间配置方法 daizj hadoop预留空间
    对于datanode配置预留空间的方法 为：在hdfs-site.xml添加如下配置  <property>     <name>dfs.datanode.du.reserved</name>     <value>10737418240</value>    
  • mysql远程访问的设置 dcj3sjt126com mysql防火墙
    第一步: 激活网络设置 你需要编辑mysql配置文件my.cnf. 通常状况，my.cnf放置于在以下目录： /etc/mysql/my.cnf (Debian linux) /etc/my.cnf （Red Hat Linux/Fedora Linux) /var/db/mysql/my.cnf (FreeBSD) 然后用vi编辑my.cnf，修改内容从以下行： [mysqld] 你所需要: 1
  • ios 使用特定的popToViewController返回到相应的Controller dcj3sjt126com controller
    1、取navigationCtroller中的Controllers NSArray * ctrlArray = self.navigationController.viewControllers; 2、取出后，执行， [self.navigationController popToViewController:[ctrlArray objectAtIndex:0] animated:YES
  • Linux正则表达式和通配符的区别 eksliang 正则表达式通配符和正则表达式的区别通配符
    转载请出自出处：http://eksliang.iteye.com/blog/1976579 首先得明白二者是截然不同的 通配符只能用在shell命令中,用来处理字符串的的匹配。 判断一个命令是否为bash shell(linux 默认的shell)的内置命令 type -t commad 返回结果含义 file  表示为外部命令 alias  表示该
  • Ubuntu Mysql Install and CONF gengzg Install
    http://www.navicat.com.cn/download/navicat-for-mysql Step1: 下载Navicat ，网址：http://www.navicat.com/en/download/download.html Step2：进入下载目录，解压压缩包：tar -zxvf navicat11_mysql_en.tar.gz
  • 批处理，删除文件bat huqiji windowsdos
    @echo off ::演示：删除指定路径下指定天数之前（以文件名中包含的日期字符串为准）的文件。 ::如果演示结果无误，把del前面的echo去掉，即可实现真正删除。 ::本例假设文件名中包含的日期字符串（比如：bak-2009-12-25.log） rem 指定待删除文件的存放路径 set SrcDir=C:/Test/BatHome rem 指定天数 set DaysAgo=1
  • 跨浏览器兼容的HTML5视频音频播放器 天梯梦 html5
    HTML5的video和audio标签是用来在网页中加入视频和音频的标签，在支持html5的浏览器中不需要预先加载Adobe Flash浏览器插件就能轻松快速的播放视频和音频文件。而html5media.js可以在不支持html5的浏览器上使video和audio标签生效。   How to enable <video> and <audio> tags in
  • Bundle自定义数据传递 hm4123660 androidSerializable自定义数据传递BundleParcelable
          我们都知道Bundle可能过put****()方法添加各种基本类型的数据，Intent也可以通过putExtras(Bundle)将数据添加进去，然后通过startActivity()跳到下一下Activity的时候就把数据也传到下一个Activity了。如传递一个字符串到下一个Activity   把数据放到Intent
  • C＃：异步编程和线程的使用（.NET 4.5 ） powertoolsteam .net线程C#异步编程
    异步编程和线程处理是并发或并行编程非常重要的功能特征。为了实现异步编程，可使用线程也可以不用。将异步与线程同时讲，将有助于我们更好的理解它们的特征。 本文中涉及关键知识点 1. 异步编程 2. 线程的使用 3. 基于任务的异步模式 4. 并行编程 5. 总结 异步编程 什么是异步操作？异步操作是指某些操作能够独立运行，不依赖主流程或主其他处理流程。通常情况下，C＃程序
  • spark 查看 job history 日志 Stark_Summer 日志sparkhistoryjob
    SPARK_HOME/conf 下: spark-defaults.conf 增加如下内容 spark.eventLog.enabled true spark.eventLog.dir hdfs://master:8020/var/log/spark spark.eventLog.compress true spark-env.sh 增加如下内容 export SP
  • SSH框架搭建 wangxiukai2015eye springHibernatestruts
    MyEclipse搭建SSH框架 Struts Spring Hibernate 1、new一个web project。 2、右键项目，为项目添加Struts支持。    选择Struts2 Core Libraries -<MyEclipes-Library>      点击Finish。src目录下多了struts
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他