HTML5编程实战之三：图片文本(txt)拖拽预览

本文主要用到的知识

　　HTML5中的File及FileReader接口

　　相关资料：

　　　　Using files from web applications

　　　　File API

源码

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

    <title>HTML5文件拖拽预览Demo</title>

    <style type="text/css">

        h1{

            padding:0px;

            margin:0px;

        }

        div#show{

            border: 1px solid #ccc; 

            width: 400px; 

            height: 300px;

            display: -moz-box;

            display: -webkit-box;

            -moz-box-align: center;

            -webkit-box-align: center;

            -moz-box-pack: center;

            -webkit-box-pack: center;

            resize:both;

            overflow:auto;

        }

        div[id^=show]:hover{

            border: 1px solid #333; 

        }

        div#main{

            width:100%;

        }

        div#successLabel

        {

            color:Red;

        }

        div#content

        {

            display:none;

        }

    </style>

    <script type="text/javascript">

        function init() 

        {

            var dest = document.getElementById("show");

            dest.addEventListener("dragover", function(ev) 

            {

                ev.stopPropagation();

                ev.preventDefault();

            }, false);

        

            dest.addEventListener("dragend", function(ev) 

            {

                ev.stopPropagation();

                ev.preventDefault();

            }, false);

        

            dest.addEventListener("drop", function (ev) {

                ev.stopPropagation();

                ev.preventDefault();

        

                var file = ev.dataTransfer.files[0];

                var reader = new FileReader();

        

                if (file.type.substr(0, 5) == "image") {

                    reader.onload = function (event) {

                        dest.style.background = 'url(' + event.target.result + ') no-repeat center';

                        dest.innerHTML = "";

                    };

                    reader.readAsDataURL(file);

                }

                else if (file.type.substr(0, 4) == "text") {

        

                    reader.readAsText(file);

                    reader.onload = function (f) {

                        dest.innerHTML = "<pre>" + this.result + "</pre>";

                        dest.style.background = "white";

                    }

                }

                else {

                    dest.innerHTML = "暂不支持此类文件的预览";

                    dest.style.background = "white";

                }

            }, false);

        }

        

        //设置页面属性，不执行默认处理（拒绝被拖放）

        document.ondragover = function(e){e.preventDefault();};

        document.ondrop = function(e){e.preventDefault();}

        

        window.onload=init;

    </script>

</head>

<body>

    <h1>HTML5文件拖拽预览Demo</h1>

    <div id="show">

    文件预览区，仅限图片和txt文件

    </div>

</body>

</html>

主要代码解析

　　样式部分就不说了，很简单

　　dragover、dragend、drop是三个与拖拽相关的事件。

　　dragover表示被拖放的元素正在本元素范围内移动

　　dragend表示拖放操作结束

　　drop表示有其他元素被拖放到了本元素中

　　代码中先分别监听这几个事件，取消浏览器默认的行为，然后利用HTML5中的File及FileReader判断读取拖拽的文件。

　　如果文件是图片，就用FileReader的readAsDataURL方法将图片读取为DataURL字符串存入内存，并显示在DIV中。

　　如果文件是txt文本，就用FileReader的readAsText方法将文件读取为文本（默认为UTF-8格式），放到内存中，然后显示在DIV中。

你可能感兴趣的:(html5)

  • DIV+CSS+JavaScript技术制作网页（旅游主题网页设计与制作）云南大理 STU学生网页设计 网页设计期末网页作业html静态网页html5期末大作业网页设计web大作业
    ️精彩专栏推荐作者主页:【进入主页—获取更多源码】web前端期末大作业：【HTML5网页期末作业(1000套)】程序员有趣的告白方式：【HTML七夕情人节表白网页制作(110套)】文章目录二、网站介绍三、网站效果▶️1.视频演示2.图片演示四、网站代码HTML结构代码CSS样式代码五、更多源码二、网站介绍网站布局方面：计划采用目前主流的、能兼容各大主流浏览器、显示效果稳定的浮动网页布局结构。网站程
  • 关于城市旅游的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：做与用户的交互行为文章目录前端学习路线
  • h5小游戏定制开发 红匣子实力推荐
    随着科技的不断发展，移动互联网已经成为人们生活中不可或缺的一部分。在这个背景下，H5小游戏应运而生，为人们带来了丰富的娱乐体验。H5小游戏定制开发作为一种新兴的游戏开发方式，正逐渐受到市场的关注和青睐。那么，什么是H5小游戏定制开发呢？它又具有哪些特点和优势呢？让我们一起来深入了解一下。首先，我们来了解一下H5小游戏的基本概念。H5小游戏是一种基于HTML5技术的游戏，可以在移动端、PC端等多平台
  • HTML5概述 WFIT~SKY Web前端html5前端html
    1.HTML概述1.1HTML定义HTML超文本标记语言，其中超文本是链接，标记也叫标签（即带尖括号的文本）。1.2HTML基本骨架HTML基本骨架是网页模板。网页的标题网页的内容html：整个网页head：网页头部，存放给浏览器看的代码，例如CSSbody：网页主体，存放给用户看的代码，例如文字、图片title：网页标题1.3HTML关系父子关系（嵌套）兄弟关系（并列）2.HTML开发环境2.1
  • HTML添加文字 若无心_. HTMLhtml5
    一、创建HTML5文档基本标签//定义文档类型//定义HTML文档//定义关于文档的信息文档标题//定义文档的标题//定义文档的字符编码//定义文档的主体二、文字相关标签1.标题文字-标签可定义标题。定义最大的标题。定义最小的标题。Document这是标题1这是标题2这是标题3这是标题4这是标题5这是标题62.文本段落Document这次会晤的主题是“金砖国家在非洲：在第四次工业革命中共谋包容增长
  • 【拖拽】自定义拖拽图标 风露_
    一、知识点设置被拖拽的元素draggable为true(HTML5新特性)关键方法：voiddataTransfer.setDragImage(img,xOffset,yOffset);注意点：Note:Ifthe[Element]isanexisting[HTMLElement],itneedstobevisibleintheviewportinordertobeshownasadragfeed
  • Cocos2d、Cocos2dx、Cocos Creator、Cocos Studio的区别 Thomas游戏圈
    一、Cocos2d和Cocos2dx的区别【开发语言】：Cocos2d是Object-C写的，Cocos2dx是C++写的，支持使用C++、Lua或Java进行开发。【运行平台】：Cocos2d只能在IOS下运行，Cocos2dx是跨平台的，适配iOS、Android、HTML5、Windows和Mac系统，功能侧重于原生移动平台。点击链接加入群聊【Unity/Cocos交流群】【国籍】：Coco
  • web前端达到什么水平，才能找到工作？ cj瑾瑜 前端htmljavascriptcsscss3
    一、前端是什么？前端即网站前台部分，也叫前端开发，运行在PC端，移动端等浏览器上展现给用户浏览的网页。随着互联网技术的发展，HTML5，CSS3，前端框架的应用，跨平台响应式网页设计能够适应各种屏幕分辨率，完美的动效设计，给用户带来极高的用户体验。（核心技术：HTML、CSS、JavaScript）核心技术是前端开发中最基本也是最必须的三个技能。前端的开发中，在页面的布局时，HTML将元素进行定义
  • HTML5（六）canvas 矩形、路径、画板功能 祝名
    一.绘制矩形1.什么是canvascanvas标签相当于一个画板；canvas的宽高不要用css去定义，直接在标签中用属性写；2.obj=c.getContext('2d');获得2d绘画环境（相当于铺了一层画布）绘画图像的操作都会在obj这个绘画环境中存储；3.绘画方法及样式x,y为坐标样例：二.canvas路径1.方法2.样例cv.lineJoin='round';//边界类型为弧形三.画板功
  • HTML5中的数据存储sessionStorage、localStorage 阿立聊代码 HTML实战html5前端html
    第8章HTML5中的数据存储之前通常使用Cookie存储机制将数据保存在用户的客户端。H5增加了两种全新的数据存储方式：WebStroage和WebSQLDatabase.前者用于临时或永久保存客户端少量数据，后者是客户端本地化的一套数据库系统。8.1WebStorage存储简介WebStorageAPI分为会话数据和长期数据，相应的API分为两类：sessionStorage(保存会话数据)lo
  • html5carousel图片轮播,全面解析Bootstrap中Carousel轮播的使用方法 RemusrickCat
    本文实例为大家全面的解析了Bootstrap中Carousel的使用方法，供大家参考，具体内容如下源码文件：Carousel.scssCarousel.js实现原理：隐藏所有要显示的元素，然后指定当前要显示的为block，宽、高自适应源码分析：1、Html结构：主要分为以四个部分1.1、容器：最外层div，需要一个data-ride=”carousel”来指定为轮播放插件，并且提供一个Id，方便圆
  • 【Web前端技术 02】深入探索HTML5：标签全解析与案例演示！ wcyd Web前端技术前端html5html
    深入探索HTML5：标签全解析与案例演示！大家好！在上一篇文章中，我们对HTML5有了一个基本的了解。今天，我们将更深入地探索HTML5，全面介绍各种标签及其应用。从基础标签到新增标签，从文档结构到格式标签，我们将一一解析，并提供丰富的案例演示。准备好了吗？让我们开始吧！️HTML5基础结构首先，让我们回顾一下HTML5的基本结构。HTML5文档的结构就像一座房子的蓝图，指导我们如何构建网页。下面
  • HTML5中`＜span＞`标签深入解析 软考鸭 html5html5前端html
    引言在HTML5中，标签是一个行内元素，用于对文档中的一小部分文本或内容进行分组，以便于应用CSS样式或JavaScript脚本。与块级元素（如）不同，不会打断文本的流动，而是与其内容一起在同一行内显示。本文将深入解析标签的定义、用法、属性以及在实际开发中的应用。定义与用法标签是一个无语义的行内容器，用于包裹文档中的一部分内容，而不改变文档的结构。它通常与CSS和JavaScript结合使用，以实
  • HTML5 `＜button＞` 标签深入全面解析 软考鸭 html5html5前端html
    引言在HTML5中，标签用于定义一个可点击的按钮，它是创建交互式网页的重要元素之一。与相比，标签提供了更多的灵活性和样式化的可能性。本文将深入解析HTML5中的标签，详细介绍其属性、样式以及实际应用。标签的基本用法标签内部可以放置内容，如文本、图像或其他HTML元素。这使得标签比更加灵活。点击我在这个简单的例子中，我们创建了一个普通的按钮，其上的文本是“点击我”。标签的属性标签支持多种属性，用于定
  • HTML5之基础、元信息标签 Programmer.杨 前端技术-HTMLhtmlmetaheadtitle标签
    标签声明位于文档中最前面的位置，处于标签之前。声明不是一个HTML标签，它是告知Web浏览器该页面使用了哪种HTML版本（规范），浏览器用此版本（规范）对该文档进行解析，渲染。可声明的DTD有三种：分别是严格版本（strict）、过渡版本（transitional）、以及基于框架的版本（frameset），若文档不遵循其DTD规范，则此文档中的代码不但不能通过代码校验，并且有可能无法正常显示。文档
  • HTML5中`＜ul＞`标签深入全面解析 软考鸭 html5html5前端html
    在HTML5的广阔天地里，标签作为无序列表的代言人，扮演着举足轻重的角色。它不仅能够整洁地罗列信息，还通过丰富的属性和样式选项，为网页设计师提供了无限的创意空间。本文将深入剖析标签的内核，详细解读其属性与样式，助力你打造更加精致、功能强大的网页。一、标签基础概览，即UnorderedList（无序列表）的缩写，用于在网页中展示一系列无特定顺序的项目。每个项目由（ListItem，列表项）标签包裹，
  • HTML5全面知识点 A_cot htmlhtml5前端框架前端
    HTML（HyperTextMarkupLanguage）是构建网页的基础语言。以下是全面的HTML知识点：一、HTML基础概念定义：HTML是一种用于描述网页结构的标记语言，通过各种标签来定义网页的内容和布局。版本历史：从HTML的早期版本发展到现在的HTML5，功能不断增强，支持更多的多媒体和交互特性。二、HTML文档结构声明：用于告诉浏览器文档类型是HTML5。标签：整个HTML文档的根元素
  • python提取数据库数据到前端html5显示_python html提取数据库数据 weixin_39878745
    python开源工具列表【持续更新】以下是个人在工作中整理的一些pythonwheel，供参考。这个列表包含与网页抓取和数据处理的Python库网络通用urllib-网络库(stdlib)。requests-网络库。grab–网络库(基于pycurl)。pycurl–网络库(绑定libcurl)。urllib3–...文章武耀文2018-04-253128浏览量8个用于业余项目的优秀Python库
  • 掌财社:在html5中使用video进行全屏播放与自动播放的代码方法总结！ weixin_45378258 HTML
    今天由于在之前小编在项目中遇到的有关于：“在html5中使用video进行全屏播放与自动播放的代码方法总结！”这方面的内容，所以今天就来和大家分享有关于这方面的相关内容！近期开始开发公司新版官网，首页顶部（header）是一个全屏播放的小视频,现简单总结如下：页面代码：其中php简单判断了一下是否是移动设备,移动设备不展示视频(如果移动端展示的话,需要解决iOS上无法自动播放的问题):ps:如果H
  • Vue中使用pdfJs预览PDF、图片 viceen vue3+ts-运维vue项目-运维vue.jshtmlhtml5
    Vue中使用pdfJs预览PDF、图片pdf.js是一个使用HTML5构建的可移植文档格式库。它可以帮助我们在浏览器中构建pdf文档，实现在线查看pdf文件的功能。实现步骤如下：1.下载pdfJs到本地（官网下载地址），放到项目根目录下的静态资源目录static文件夹内，将文件命名为pdfJs。如下图使用iframe打开或者需要注意的是：file参数中默认只允许传简单路径比如：http://www
  • 【WebKit深度解析】HTML5支持全景与实践指南 2401_85812026 webkithtml5前端
    标题：【WebKit深度解析】HTML5支持全景与实践指南WebKit作为许多现代浏览器的核心技术，对HTML5的支持程度直接关系到Web应用的性能和体验。HTML5是构建现代Web应用的基石，提供了丰富的特性和API。本文将深入探讨WebKit对HTML5的支持程度，并通过实际代码示例，展示如何在WebKit浏览器上充分利用HTML5的强大功能。1.WebKit与HTML5概述WebKit是一个
  • HTML5 ＜video＞常用属性、时间、方法及基础使用说明 Wu Youlu java前端javascript
    简介HTML元素用于在文档中嵌入媒体播放器，用于支持文档内的视频播放。标签也可用于播放音频，但播放音频用更加适合。元素支持三种视频格式：MP4,WebM,和Ogg:MP4=带有H.264视频编码和AAC音频编码的MPEG4文件WebM=带有VP8视频编码和Vorbis音频编码的WebM文件Ogg=带有Theora视频编码和Vorbis音频编码的Ogg文件基础写法Yourbrowserdoesnot
  • WebAPI DOM文档对象模型 znhyXYG javascript前端开发语言
    DOM（文档对象模型）是一个可以改变网页内容、结构、样式的处理可扩展标记语言的接口一、获取元素方法：1、根据ID获取2、根据标签名获取3、根据类名获取（html5新增）4、querySelector获取（html5新增）5、querySelectorAll获取（html5新增）6、获取特殊元素（body、html）ID获取方法：document.getElementById(); 2019-9-9
  • 使用fabric.js简简单单实现一个画板 小草先森tyro 前端
    什么是fabricfabric是一个功能强大的JavaScript库,运行在HTML5canvas上。fabric为canvas提供了一个交互式对象模型，以及一个svg-to-canvas解析器。与canvas的区别来一个简单的例子来说明一下fabric与canvas的区别，假设我们想在一个画布上画一个红色的矩形：//原生canvasapi//有一个id是c的canvas元素varcanvasEl
  • 探索 Fabric.js：前端开发的轻量级图形编辑框架 滑辰煦Marc
    探索Fabric.js：前端开发的轻量级图形编辑框架是一个强大的、基于WebGL和SVG的JavaScript图形库，专为构建交互式图形界面而设计。它提供了一种简单的方式来在网页上创建和操纵矢量对象，包括文本、形状、图像等，并且具有丰富的可定制性和性能优化。项目简介Fabric.js提供了一个统一的对象模型，使得处理HTML5canvas上的元素变得异常简单。无论是创建复杂的绘图应用，还是实现动态
  • 用html写出生日蛋糕,纯HTML5+CSS3制作生日蛋糕代码 天眼查 用html写出生日蛋糕
    .birthday.container{width:600px;height:600px;margin:0pxauto;background:#fafafa;border-radius:5px;position:relative;}/****顶层的**/.birthday.top-one{position:absolute;width:280px;height:280px;bottom:200px
  • HTML5生日祝福蛋糕页面(生日蛋糕树) HTML+CSS+JS 求婚 html生日快乐祝福代码网页 520情人节告白代码 程序员表白源码 抖音3D旋转相册 js烟花代码 css爱心 @秋天的笔记 生日祝福网页html520情人节告白网页制作七夕情人节表白网页源代码HTML5七夕情人节动画网页HTML生日快乐代码3D旋转电子相册
    HTML5七夕情人节表白网页❤生日蛋糕(蛋糕树)❤HTML+CSS+JS求婚html生日快乐祝福代码网页520情人节告白代码程序员表白源码抖音3D旋转相册js烟花代码css爱心表白这是程序员表白系列中的100款网站表白之一，旨在让任何人都能使用并创建自己的表白网站给心爱的人看。此波共有100个表白网站，可以任意修改和使用，源码已上传，演示网址如下。文章末尾-已经附上源码下载地址作者主页-更多源码1
  • 记录-小程序720°VR（跳转H5页面实现） 久违的小技巧 小程序小程序vrjavascript
    全景浏览提前准备1拍照支架/照片合成软件（KolorAutopanoGiga4.0）或者全景相机2pannellum（pannellum是一个轻量级、免费和开源的Web全景查看器。它使用HTML5、CSS3、JavaScript和WebGL构建，没有插件。）3H5页面引入pannellum.js/css文件，swiper/jquery文件（因为需要在全景图底部显示可切换图片，与dom操作/ajax
  • HTML5与CSS3 Mousse.- htmlcss前端html5css3
    HTML部分##什么是网页：1.网站是指在因特网上根据一定的规则，使用HTML等制作的用于展示特定内容相关的网页集合。2.网页是网站中的一“页”，通常是HTML格式的文件，它要通过浏览器来阅读。##网页的组成：1.网页是构成网站的基本元素，它通常由图片、链接、文字、声音、视频等元素组成。通常我们看到的网页，常见以.htm或.html后缀结尾的文件，因此将其俗称为HTML文件。##什么是HTML：1
  • html页面js获取参数值 0624chenhong html
    1.js获取参数值js function GetQueryString(name) {      var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");      var r = windo
  • MongoDB 在多线程高并发下的问题 BigCat2013 mongodbDB高并发重复数据
    最近项目用到 MongoDB , 主要是一些读取数据及改状态位的操作. 因为是结合了最近流行的 Storm进行大数据的分析处理，并将分析结果插入Vertica数据库，所以在多线程高并发的情境下, 会发现 Vertica 数据库中有部分重复的数据. 这到底是什么原因导致的呢？笔者开始也是一筹莫 展，重复去看 MongoDB 的 API , 终于有了新发现 ： com.mongodb.DB 这个类有
  • c++ 用类模版实现链表(c++语言程序设计第四版示例代码) CrazyMizzz 数据结构C++
    #include<iostream> #include<cassert> using namespace std; template<class T> class Node { private: Node<T> * next; public: T data;
  • 最近情况 麦田的设计者 感慨考试生活
       在五月黄梅天的岁月里，一年两次的软考又要开始了。到目前为止，我已经考了多达三次的软考，最后的结果就是通过了初级考试（程序员）。人啊，就是不满足，考了初级就希望考中级，于是，这学期我就报考了中级，明天就要考试。感觉机会不大，期待奇迹发生吧。这个学期忙于练车，写项目，反正最后是一团糟。后天还要考试科目二。这个星期真的是很艰难的一周，希望能快点度过。   
  • linux系统中用pkill踢出在线登录用户 被触发 linux
    由于linux服务器允许多用户登录，公司很多人知道密码，工作造成一定的障碍所以需要有时踢出指定的用户 1/#who   查出当前有那些终端登录（用 w 命令更详细） # who root     pts/0        2010-10-28 09:36 (192
  • 仿QQ聊天第二版 肆无忌惮_ qq
    在第一版之上的改进内容:  第一版链接: http://479001499.iteye.com/admin/blogs/2100893   用map存起来号码对应的聊天窗口对象,解决私聊的时候所有消息发到一个窗口的问题. 增加ViewInfo类,这个是信息预览的窗口,如果是自己的信息,则可以进行编辑.   信息修改后上传至服务器再告诉所有用户,自己的窗口
  • java读取配置文件 知了ing
    1，java读取.properties配置文件 InputStream in; try { in = test.class.getClassLoader().getResourceAsStream("config/ipnetOracle.properties");//配置文件的路径 Properties p = new Properties()
  • __attribute__ 你知多少？ 矮蛋蛋 C++gcc
    原文地址: http://www.cnblogs.com/astwish/p/3460618.html GNU C 的一大特色就是__attribute__ 机制。__attribute__ 可以设置函数属性（Function Attribute ）、变量属性（Variable Attribute ）和类型属性（Type Attribute ）。 __attribute__ 书写特征是：
  • jsoup使用笔记 alleni123 java爬虫JSoup
    <dependency> <groupId>org.jsoup</groupId> <artifactId>jsoup</artifactId> <version>1.7.3</version> </dependency> 2014/08/28 今天遇到这种形式，
  • JAVA中的集合 Collectio 和Map的简单使用及方法 百合不是茶 listmapset
             List ,set ,map的使用方法和区别 java容器类类库的用途是保存对象，并将其分为两个概念：     Collection集合：一个独立的序列，这些序列都服从一条或多条规则;List必须按顺序保存元素  ，set不能重复元素；Queue按照排队规则来确定对象产生的顺序（通常与他们被插入的
  • 杀LINUX的JOB进程 bijian1013 linuxunix
    今天发现数据库一个JOB一直在执行，都执行了好几个小时还在执行，所以想办法给删除掉   系统环境：    ORACLE 10G    Linux操作系统   操作步骤如下： 第一步.查询出来那个job在运行，找个对应的SID字段 select * from dba_jobs_running--找到job对应的sid &n
  • Spring AOP详解 bijian1013 javaspringAOP
            最近项目中遇到了以下几点需求，仔细思考之后，觉得采用AOP来解决。一方面是为了以更加灵活的方式来解决问题，另一方面是借此机会深入学习Spring AOP相关的内容。例如，以下需求不用AOP肯定也能解决，至于是否牵强附会，仁者见仁智者见智。 1.对部分函数的调用进行日志记录，用于观察特定问题在运行过程中的函数调用
  • [Gson六]Gson类型适配器(TypeAdapter) bit1129 Adapter
    TypeAdapter的使用动机  Gson在序列化和反序列化时，默认情况下，是按照POJO类的字段属性名和JSON串键进行一一映射匹配，然后把JSON串的键对应的值转换成POJO相同字段对应的值，反之亦然，在这个过程中有一个JSON串Key对应的Value和对象之间如何转换(序列化/反序列化)的问题。   以Date为例，在序列化和反序列化时，Gson默认使用java.
  • 【spark八十七】给定Driver Program， 如何判断哪些代码在Driver运行，哪些代码在Worker上执行 bit1129 driver
    Driver Program是用户编写的提交给Spark集群执行的application，它包含两部分 作为驱动： Driver与Master、Worker协作完成application进程的启动、DAG划分、计算任务封装、计算任务分发到各个计算节点(Worker)、计算资源的分配等。 计算逻辑本身，当计算任务在Worker执行时，执行计算逻辑完成application的计算任务
  • nginx 经验总结 ronin47 nginx 总结
    　　　深感nginx的强大，只学了皮毛，把学下的记录。 　　　获取Header 信息，一般是以$http_XX（ＸＸ是小写）            获取body,通过接口，再展开，根据Ｋ取Ｖ 　　　获取uri,以$arg_XX      &n
  • 轩辕互动-1.求三个整数中第二大的数2.整型数组的平衡点 bylijinnan 数组
    import java.util.ArrayList; import java.util.Arrays; import java.util.List; public class ExoWeb { public static void main(String[] args) { ExoWeb ew=new ExoWeb(); System.out.pri
  • Netty源码学习-Java-NIO-Reactor bylijinnan java多线程netty
    Netty里面采用了NIO-based Reactor Pattern 了解这个模式对学习Netty非常有帮助 参考以下两篇文章： http://jeewanthad.blogspot.com/2013/02/reactor-pattern-explained-part-1.html http://gee.cs.oswego.edu/dl/cpjslides/nio.pdf
  • AOP通俗理解 cngolon springAOP
    1.我所知道的aop     初看aop,上来就是一大堆术语，而且还有个拉风的名字，面向切面编程，都说是OOP的一种有益补充等等。一下子让你不知所措，心想着：怪不得很多人都和 我说aop多难多难。当我看进去以后，我才发现：它就是一些java基础上的朴实无华的应用，包括ioc，包括许许多多这样的名词，都是万变不离其宗而 已。 2.为什么用aop&nb
  • cursor variable 实例 ctrain variable
    create or replace procedure proc_test01 as type emp_row is record( empno emp.empno%type, ename emp.ename%type, job emp.job%type, mgr emp.mgr%type, hiberdate emp.hiredate%type, sal emp.sal%t
  • shell报bash: service: command not found解决方法 daizj linuxshellservicejps
    今天在执行一个脚本时，本来是想在脚本中启动hdfs和hive等程序，可以在执行到service hive-server start等启动服务的命令时会报错，最终解决方法记录一下：   脚本报错如下： ./olap_quick_intall.sh: line 57: service: command not found ./olap_quick_intall.sh: line 59
  • 40个迹象表明你还是PHP菜鸟 dcj3sjt126com 设计模式PHP正则表达式oop
    你是PHP菜鸟，如果你：1. 不会利用如phpDoc 这样的工具来恰当地注释你的代码2. 对优秀的集成开发环境如Zend Studio 或Eclipse PDT 视而不见3. 从未用过任何形式的版本控制系统，如Subclipse4. 不采用某种编码与命名标准 ，以及通用约定，不能在项目开发周期里贯彻落实5. 不使用统一开发方式6. 不转换（或）也不验证某些输入或SQL查询串（译注：参考PHP相关函
  • Android逐帧动画的实现 dcj3sjt126com android
    一、代码实现： private ImageView iv; private AnimationDrawable ad; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout
  • java远程调用linux的命令或者脚本 eksliang linuxganymed-ssh2
    转载请出自出处： http://eksliang.iteye.com/blog/2105862        Java通过SSH2协议执行远程Shell脚本(ganymed-ssh2-build210.jar)   使用步骤如下： 1.导包 官网下载: http://www.ganymed.ethz.ch/ssh2/ ma
  • adb端口被占用问题 gqdy365 adb
    最近重新安装的电脑，配置了新环境，老是出现： adb server is out of date. killing... ADB server didn't ACK * failed to start daemon * 百度了一下，说是端口被占用，我开个eclipse，然后打开cmd，就提示这个，很烦人。 一个比较彻底的解决办法就是修改
  • ASP.NET使用FileUpload上传文件 hvt .netC#hovertreeasp.netwebform
    前台代码： <asp:FileUpload ID="fuKeleyi" runat="server" /> <asp:Button ID="BtnUp" runat="server" onclick="BtnUp_Click" Text="上 传" />
  • 代码之谜（四）- 浮点数（从惊讶到思考） justjavac 浮点数精度代码之谜IEEE
    在『代码之谜』系列的前几篇文章中，很多次出现了浮点数。 浮点数在很多编程语言中被称为简单数据类型，其实，浮点数比起那些复杂数据类型（比如字符串）来说， 一点都不简单。 单单是说明 IEEE浮点数 就可以写一本书了，我将用几篇博文来简单的说说我所理解的浮点数，算是抛砖引玉吧。 一次面试 记得多年前我招聘 Java 程序员时的一次关于浮点数、二分法、编码的面试， 多年以后，他已经称为了一名很出色的
  • 数据结构随记_1 lx.asymmetric 数据结构笔记
    第一章   1.数据结构包括数据的 逻辑结构、数据的物理/存储结构和数据的逻辑关系这三个方面的内容。 2.数据的存储结构可用四种基本的存储方法表示，它们分别是 顺序存储、链式存储 、索引存储 和 散列存储。 3.数据运算最常用的有五种，分别是  查找/检索、排序、插入、删除、修改。 4.算法主要有以下五个特性：  输入、输出、可行性、确定性和有穷性。 5.算法分析的
  • linux的会话和进程组 网络接口 linux
    会话： 一个或多个进程组。起于用户登录，终止于用户退出。此期间所有进程都属于这个会话期。会话首进程：调用setsid创建会话的进程1.规定组长进程不能调用setsid，因为调用setsid后，调用进程会成为新的进程组的组长进程.如何保证？ 先调用fork，然后终止父进程，此时由于子进程的进程组ID为父进程的进程组ID，而子进程的ID是重新分配的，所以保证子进程不会是进程组长，从而子进程可以调用se
  • 二维数组 元素的连续求解 1140566087 二维数组ACM
    import java.util.HashMap; public class Title { public static void main(String[] args){ f(); } // 二位数组的应用 //12、二维数组中，哪一行或哪一列的连续存放的0的个数最多，是几个0。注意，是“连续”。 public static void f(){
  • 也谈什么时候Java比C++快 windshome javaC++
      刚打开iteye就看到这个标题“Java什么时候比C++快”，觉得很好笑。   你要比，就比同等水平的基础上的相比，笨蛋写得C代码和C++代码，去和高手写的Java代码比效率，有什么意义呢？   我是写密码算法的，深刻知道算法C和C++实现和Java实现之间的效率差，甚至也比对过C代码和汇编代码的效率差，计算机是个死的东西，再怎么优化，Java也就是和C
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他