吃一口你的梦。
吃一口你的梦。

XMLHttpRequest的基本使用

XMLHttpRequest - 基本使用

  1. AJAX 是浏览器于服务器通信的技术，采用 XMLHttpRequest 对象相关代码
  2. axios 是对 XHR 相关代码进行了封装，让我们只关心传递的接口参数
  3. 学习 XHR 也是了解 axios 内部与服务器交互过程的真正原理XMLHttpRequest的基本使用_第1张图片
  4. 语法如下：
<script>
	const xhr = new XMLHttpRequest()
	xhr.open('请求方法', '请求url网址')
	xhr.addEventListener('loadend', () => {
	  // 响应结果
	  console.log(xhr.response)
	})
	xhr.send()
script>

XMLHttpRequest的基本使用_第2张图片
5. 需求：以一个需求来体验下原生 XHR 语法，获取所有省份列表并展示到页面上
6. 代码如下：

DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>XMLHttpRequest_基础使用title>
head>

<body>
  <p class="my-p">p>
  <script>
    /**
     * 目标：使用XMLHttpRequest对象与服务器通信
     *  1. 创建 XMLHttpRequest 对象
     *  2. 配置请求方法和请求 url 地址
     *  3. 监听 loadend 事件，接收响应结果
     *  4. 发起请求
    */
    // 1. 创建 XMLHttpRequest 对象
    const xhr = new XMLHttpRequest()

    // 2. 配置请求方法和请求 url 地址
    xhr.open('GET', 'http://hmajax.itheima.net/api/province')

    // 3. 监听 loadend 事件，接收响应结果
    xhr.addEventListener('loadend', () => {
      console.log(xhr.response)
      const data = JSON.parse(xhr.response)
      console.log(data.list.join('
'))
      document.querySelector('.my-p').innerHTML = data.list.join('
')
    })

    // 4. 发起请求
    xhr.send()
  script>
body>

html>

XMLHttpRequest - 查询参数

  1. 什么是查询参数：携带额外信息给服务器，返回匹配想要的数据
  2. 查询参数原理要携带的位置和语法：http://xxxx.com/xxx/xxx?参数名1=值1&参数名2=值2
  3. 所以，原生 XHR 想要自己在 url 后面携带查询参数字符串，没有 axios 帮助我们把 params 参数拼接到 url 字符串后面了
  4. 需求：查询河北省下属的城市列表
    XMLHttpRequest的基本使用_第3张图片
  5. 核心代码如下：
<script>
	/**
	 * 目标：使用XHR携带查询参数，展示某个省下属的城市列表
	*/
	const xhr = new XMLHttpRequest()
	xhr.open('GET', 'http://hmajax.itheima.net/api/city?pname=辽宁省')
	xhr.addEventListener('loadend', () => {
	  console.log(xhr.response)
	  const data = JSON.parse(xhr.response)
	  console.log(data)
	  document.querySelector('.city-p').innerHTML = data.list.join('
')
	})
	xhr.send()
script>

XMLHttpRequest - 数据提交

  1. 了解原生 XHR 进行数据提交的方式
  2. 需求：通过 XHR 完成注册用户功能
    XMLHttpRequest的基本使用_第4张图片
  3. 步骤和语法：
    1. 注意1：这次没有 axios 帮我们了，我们需要自己设置请求头 Content - Type : application/json，来告诉服务器端，我们发过去的内容类型是JSON字符串，让他转成对应数据结构取值使用
    2. 注意2：没有 axios 了，我们前端要传递的请求体数据，也没人帮我把 JS 对象转成 JSON 字符串了，需要我们自己转换
    3. 注意3：原生 XHR 需要在 send 方法调用时，传入请求体携带
<script>
	const xhr = new XMLHttpRequest()
	xhr.open('请求方法', '请求url网址')
	xhr.addEventListener('loadend', () => {
	  console.log(xhr.response)
	})
	
	// 1. 告诉服务器，我传递的内容类型，是 JSON 字符串
	xhr.setRequestHeader('Content-Type', 'application/json')
	// 2. 准备数据并转成 JSON 字符串
	const user = { username: 'itheima007', password: '7654321' }
	const userStr = JSON.stringify(user)
	// 3. 发送请求体数据
	xhr.send(userStr)
script>

你可能感兴趣的:(javascript,前端)

  • 防重复提交思路 harmful_sheep springbootjava
    本文将从以下几个方面展开：（1）重复提交产生的原因（2）什么是幂等性（3）针对重复提交，前后端的解决方案（4）如果实现一个防重复提交工具产生原因由于重复点击或者网络重发eg:点击提交按钮两次;点击刷新按钮;使用浏览器后退按钮重复之前的操作，导致重复提交表单;使用浏览器历史记录重复提交表单;浏览器重复的HTTP请求;nginx重发等情况;分布式RPC的try重发等;主要有2个部分：（1）前端用户操作
  • html5 二进制数据解析,JavaScript读写二进制数据的方法详解 如果有片海 html5二进制数据解析
    前言二进制是计算技术中广泛采用的一种数制。二进制数据是用0和1两个数码来表示的数，如果想要在前端中处理音频和视频。那你必须要对二进制数据有很好地掌握和操作能力。下面话不多说了，来一起看看详细介绍的吧类型化数组的出现类型化数组是HTML5中引入的API，它能够让开发者使用JavaScript直接操作二进制数据。在类型化数组出现之前，我们是无法直接通过JavaScript操作二进制数据，通常都是操作J
  • 前端如何播放二进制音频数据 尼古拉斯网页匠 音视频javascriptreact.js
    音频数据播放数据consttryListen=async(row)=>{awakenPlay(row.sid).then((res)=>{//请求接口，拿到二进制音频数据constbinaryData=atob(res.data);//将二进制数据转换为Uint8ArrayconstbyteArray=newUint8Array(binaryData.length);for(leti=0;i
  • JavaScript结构型设计模式---外观模式 安静一会儿 JavaScript设计模式设计模式外观模式
    参考书籍：JavaScript设计模式外观模式：为一组复杂的子系统接口提供一个更高级的统一接口，使更加容易的访问子系统对底层结构兼容性做封装functionaddEvent(dom,type,fn){//if(dom.addEventListener){dom.addEventListener(type,fn,false);//}elseif(dom.attachEvent){dom.attach
  • JavaScript设计模式 -- 迭代器模式 鎈卟誃筅甡 javascript设计模式迭代器模式
    在软件开发中，我们经常需要遍历集合、数组、链表、树等数据结构。传统上，这些数据结构往往需要暴露内部实现细节，或者写大量重复的遍历代码。**迭代器模式（IteratorPattern）**提供了一种统一的方式来访问集合内的元素，而不暴露集合的内部表示。通过定义统一的迭代器接口，可以使客户端代码与数据结构实现解耦，从而使系统更易扩展和维护。迭代器模式简介迭代器模式属于行为型设计模式，其主要思想是将遍历
  • JavaScript设计模式 -- 适配器模式 鎈卟誃筅甡 javascript设计模式适配器模式
    在软件开发中，经常会遇到这样的情况：现有的类或第三方库提供的接口与系统中期望的接口不匹配。如果直接修改已有代码风险较大或者不可行，这时适配器模式（AdapterPattern）就能派上用场。适配器模式通过创建一个包装类，将原有接口转换为客户所期望的接口，从而使原本不兼容的类能够协同工作。本文将从基本概念入手，详细介绍适配器模式的实现方式及其在多个场景下的应用示例，并探讨其优缺点和使用建议。适配器模
  • javascript 常见设计模式 smiley121 javascript设计模式
    什么是设计模式?在软件开发中，设计模式是解决特定问题的经验总结和可复用的解决方案。设计模式可以提高代码的复用性、可维护性和可读性，是提高开发效率的重要手段。单例模式1.概念单例模式（SingletonPattern），保证一个类只有一个实例，并提供一个访问它的全局访问点。也就是说，第二次使用同一个类创建新对象的时候，应该得到与第一次创建的对象完全相同的对象。2.代码实现classSingleton
  • JavaScript数组-获取数组中的元素 難釋懷 javascript开发语言前端
    在JavaScript中，数组是一种非常实用的数据结构，它允许我们将多个值存储在一个单独的变量中。无论是数字、字符串还是对象，都可以作为数组的元素。获取数组中的特定元素是操作数组的基础技能之一。本文将详细介绍如何在JavaScript中获取数组中的元素。一、通过索引访问元素基本概念数组中的每个元素都有一个对应的索引，这个索引是从0开始计数的整数。也就是说，第一个元素的索引为0，第二个元素的索引为1
  • HTML之JavaScript DOM（document）编程处理事件 录大大i 前端HTMLJavaScriptjavascripthtml前端
    HTML之JavaScriptDOM（document）编程处理事件Document/*事件：本质是行为，用户的行为或者浏览器的行为；事件发生指的是处罚js函数执行事件的三要素：事件源、事件、事件处理程序事件的绑定：1.通过元素的属性绑定on***2.通过DOM编程动态绑定注：1.一个事件可以绑定多个函数；eg：onclick="show(),show1()2.一个元素可以绑定多个事件eg：onc
  • 前端面试题 阿芯爱编程 面试前端
    以下是一些前端面试题：一、HTML/CSS部分请描述HTML的语义化标签的重要性，并列举一些常用的语义化标签。答案：重要性：对搜索引擎优化（SEO）有帮助，搜索引擎能够更好地理解页面结构，从而提高网站在搜索结果中的排名。提高代码的可读性和可维护性，使开发者更容易理解页面布局和功能逻辑。对于辅助技术（如屏幕阅读器）更友好，能够准确地向用户传达页面内容。常用语义化标签：：定义页面或区域的头部内容，通常
  • 【linux numa】 NUMA 绑核 Dayu_log linuxlinux
    1.NUMA的前世今生NUMA（NonUniformMemoryAccess）和UMA（UniformMemoryAccess）是两种CPU相关的硬件架构。在早期的UMA架构中，CPU通过前端总线（FSB，FrontSideBus）连接到北桥芯片，然后北桥芯片连接到内存，即内存控制器集成在北桥芯片中。外部IO设备与南桥芯片相连，南桥芯片与北桥芯片通过内部总线相连。下图为UMA架构图下图为早期的UM
  • JavaScript系列（75）--代理模式专题 ᅟᅠ        ‌‍‎‏ 一进制 JavaScriptjavascript代理模式开发语言
    JavaScript代理模式专题JavaScript的Proxy提供了强大的对象代理能力，能够拦截和自定义对象的基本操作。本文将深入探讨Proxy的各种模式、应用场景和最佳实践。代理基础小知识：代理模式允许我们创建一个对象的代理，从而可以控制对这个对象的访问。JavaScript的ProxyAPI提供了13种基本操作的拦截器（trap），使我们能够自定义对象的行为。//基础代理操作consttar
  • 前端高级面试题 阿芯爱编程 面试前端
    以下是一些前端高级面试可能涉及到的内容：一、前端工程化如何构建一个适合大型团队的前端代码规范和构建流程？答案：代码规范方面：使用ESLint结合Prettier来统一JavaScript和CSS（包括预处理器如Sass或Less）的语法风格。例如，规定变量命名采用驼峰命名法，函数名要有明确含义等。对于HTML结构，制定语义化标签的使用规范，如导航栏使用标签，页脚使用标签等。确定组件化的规范，包括组
  • javascript 基础 insertAfter与insertBefore 老老老刘啊 Javascript基础
    1.parent.insertBefore(newElement,targetElement.nextSibling)他的三部分为父节点新节点目标节点他会把新节点创建在目标节点之前需要注意的是父节点并无需获取你通过目标节点.parentNode就可以获取但是js并没有提供插入在目标节点之后的方法我们可以自己写一个functioninsertAfter(newElement,targetElemen
  • javascript当中insertBefore的用法 qq_44594371 javascriptjavascriptinsertBeforeinsertBefore
    例1.3（insertBeforeIEFF.html）1111msgtest222aaaaaaaaendinsertedNodevarinsertedNode=document.getElementById("insertedNode");varaaa=document.getElementById("aaa");vartest=document.getElementById("contain")
  • Vue 实现全球国家国旗的使用，附全球国家的JSON数据 Song_Estelle vue前端vue.jsjsonjavascript
    有时在前端展示中需要用到全球国家的国旗图标，我们可以用到flag-icon-css这个插件。1.安装flag-icon-cssnpminstallflag-icon-css2.在main.js中全局引用import'flag-icon-css/css/flag-icons.css'3.在界面中使用换不同的国旗，将flag-icon-后的国家代码换掉就行，国家代码对照表iso-3166-1全球国家名
  • 服务器数据传输协议,详解前端websocket服务器之数据传输协议 前言 服务器发送数据 服务端接受数据 总结... weixin_39980575 服务器数据传输协议
    前言上一篇文章我们初步搭建了一个websocket，但是还不能发送和接收数据，这篇文章我们聊一聊它是如何收发数据的。websocket支持文本和二进制的传输，内部是如何接收和发送数据的对使用者来说是不可见的，虽然这不影响使用，但是为了更加深入了解websocket的原理，我们还是有必要一探究竟！我们首先来看一张数据结构的二进制图，如下：如图1，乍一看可能看不懂，我先来解释一下：图1最上面表示的是二
  • JS(70-89) 小箌 javascript开发语言学习
    01_内置对象-Math介绍：Math对象是JavaScript提供的一个“数学”对象作用：提供了一系列做数学运算的方法Math对象包含的方法有：random：生成0-1之间的随机数（包含0不包括1）ceil：向上取整floor：向下取整max：找最大数min：找最小数pow：幂运算abs：绝对值生成任意范围随机数介绍：Math.random()随机数函数，返回一个0-1之间，并且包括0不包括1的
  • JS(1-69) 小箌 javascript开发语言学习
    01_JS介绍1.1JS是什么1.JavaScript（是什么？)是一种运行在客户端（浏览器）的编程语言，实现人机交互效果。2.作用（做什么？)网页特效（监听用户的一些行为让网页作出对应的反馈)表单验证（针对表单数据的合法性进行判断）数据交互（获取后台的数据，渲染到前端服务端编程（node.js)3.JavaScript的组成（有什么？)ECMAScript:规定了js基础语法核心知识。口比如：变
  • 关于前端产品在低代码上的探索：解锁中台架构的更多可能 代码简单说 前端低代码架构
    撮合前端平台在低代码平台上的落地探索：解锁中台架构的更多可能前言在当前技术高速发展的环境中，中台架构的应用早已成为大规模企业的常态，尤其是在拥有多业务线的公司。中台不仅简化了跨部门协作的流程，还提高了业务的响应速度和创新能力。这种架构的核心在于复用已有能力，实现快速上线和低成本运维。然而，前端业务高度依赖用户需求的变化，需要更灵活的动态能力，因此构建一个灵活的“前端中台”成为我们新的探索方向。在撮
  • 成功撒花特效 吉吉安 css特效撒花特效撒花动画成功特效前端前端开发
    基础效果：前端安装并引入canvas-confetti包如有问题请使用满血版DeepSeek/国内直连GPT/Claude解答1.安装npminstall--savecanvas-confetti2.在前端代码中引用importconfettifrom'canvas-confetti';2.在前端代码中使用把下面这个直接放到你的函数里面，调用即可，调用时机由自己控制，比如成功状态或者其他时机con
  • Trae 项目常见问题解决方案 强和毓Hadley
    Trae项目常见问题解决方案trae:postbox:MinimalisticFetchbasedHTTPclient项目地址:https://gitcode.com/gh_mirrors/tr/trae项目基础介绍Trae是一个基于FetchAPI的极简HTTP客户端，旨在提供一个简单、轻量级的HTTP请求工具。该项目的主要编程语言是TypeScript和JavaScript。Trae的设计理念
  • 基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件 练练科技 java课程设计mysql
    基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件基于Java毕业设计学术会议论文稿件管理系统源码+系统+mysql+lw文档+部署软件本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7
  • java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署 花样1999 mysql数据库java
    java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计web实验室课表管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQ
  • java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署 沪港 mysqljava数据库
    java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署java计算机毕业设计运动会管理系统源码+mysql数据库+系统+lw文档+部署本源码技术栈：项目架构：B/S架构开发语言：Java语言开发软件：ideaeclipse前端技术：Layui、HTML、CSS、JS、JQuery等技术后端技术：JAVA运行环境：Win10、JDK1.8数据库：MySQL5.7/8.0源码
  • 【app逆向】Frida-rpc 的常用python脚本 小宇python app逆向rpcjavascriptpython
    1.1Frida-rpc常用脚本在执行frida-rpc时，会涉及到先关参数类型的处理和转换，例如：python程序调用时，传入参数？frida的JavaScript脚本如何获取参数？JavaScript的参数如何转换到Java中所需的类型？1.1.1python传参在python中给frida的JavaScript脚本传入参数时，一般有如下几种情况：字符串/整型/浮点型等直接传递。importf
  • springboot029网上购物商城系统 Q_97095639 springboot毕业设计数据库毕业设计课程设计
    版权声明所有作品均为本人原创，提供参考学习使用，如需要源码+数据库+配套文档请移步www.taobysj.com搜索获取技术实现开发语言：Java+vue。框架：后端spingboot+前端vue。模式：B/S。数据库：mysql。开发工具：idea。论文字数：1万左右。数据库表个数：10个左右。运行环境：jdk+idea+mysql。版本不限制，包安装运行！项目优点：前后端分离，注释详细，代码简
  • 前端布局的方式有哪些 IT木昜 大白话前端面试题前端
    前端布局的方式有哪些在前端开发里，布局就像是装修房子，把不同的东西合理地摆放在合适的位置，让整个空间既美观又实用。下面给你介绍几种常见的前端布局方式：1.普通流布局（标准文档流布局）这就像是按顺序往书架上摆书，一本挨着一本，从左到右，从上到下依次排列。在网页里，元素默认就是按照这种方式排列的。比如段落、标题这些元素，一个接一个地显示在页面上。块级元素（像、等）会独占一行，就像大本书会占一整层书架；
  • HTML CSS整理笔记（建议收藏） 程序员的生活1 jsweb前端html+csscssjavascripthtmlcss3
    点击链接后退页面：回到上一个网页——修改placeholder提示的样式：打造全网web前端全栈资料库（总目录）看完学的更快，掌握的更加牢固，你值得拥有（持续更新）1.除IE外通用写法类名或标签名::placeholder{color:red;}2.加兼容前缀写法css超出一行显示省略号：给定宽度(width:100px)、超出隐藏（overflow:hidden）、强制在同一行显示（white-
  • 一些我不知道的HTML前端基础知识笔记 han1140521792 学习资料HTML5CSSJavaScript
    点击链接后退页面：回到上一个网页——修改placeholder提示的样式：1.除IE外通用写法类名或标签名::placeholder{color:red;}2.加兼容前缀写法css超出一行显示省略号：给定宽度(width:100px)、超出隐藏（overflow:hidden）、强制在同一行显示（white-space:nowrap）、省略号（text-overflow:ellipsis）——常见
  • 统一思想认识 永夜-极光 思想
    1.统一思想认识的基础,才能有的放矢  原因:    总有一种描述事物的方式最贴近本质,最容易让人理解.    如何让教育更轻松,在于找到最适合学生的方式.          难点在于,如何模拟对方的思维基础选择合适的方式.   &
  • Joda Time使用笔记 bylijinnan javajoda time
    Joda Time的介绍可以参考这篇文章： http://www.ibm.com/developerworks/cn/java/j-jodatime.html 工作中也常常用到Joda Time，为了避免每次使用都查API，记录一下常用的用法：     /** * DateTime变化（增减） */ @Tes
  • FileUtils API eksliang FileUtilsFileUtils API
    转载请出自出处：http://eksliang.iteye.com/blog/2217374 一、概述 这是一个Java操作文件的常用库，是Apache对java的IO包的封装，这里面有两个非常核心的类FilenameUtils跟FileUtils，其中FilenameUtils是对文件名操作的封装;FileUtils是文件封装，开发中对文件的操作，几乎都可以在这个框架里面找到。 非常的好用。
  • 各种新兴技术 不懂事的小屁孩 技术
    1:gradle Gradle 是以 Groovy 语言为基础，面向Java应用为主。基于DSL（领域特定语言）语法的自动化构建工具。 现在构建系统常用到maven工具，现在有更容易上手的gradle， 搭建java环境: http://www.ibm.com/developerworks/cn/opensource/os-cn-gradle/ 搭建android环境： http://m
  • tomcat6的https双向认证 酷的飞上天空 tomcat6
    1.生成服务器端证书 keytool -genkey -keyalg RSA -dname "cn=localhost,ou=sango,o=none,l=china,st=beijing,c=cn" -alias server -keypass password -keystore server.jks -storepass password -validity 36
  • 托管虚拟桌面市场势不可挡 蓝儿唯美
    用户还需要冗余的数据中心，dinCloud的高级副总裁兼首席营销官Ali Din指出。该公司转售一个MSP可以让用户登录并管理和提供服务的用于DaaS的云自动化控制台，提供服务或者MSP也可以自己来控制。 在某些情况下，MSP会在dinCloud的云服务上进行服务分层，如监控和补丁管理。 MSP的利润空间将根据其参与的程度而有所不同，Din说。 “我们有一些合作伙伴负责将我们推荐给客户作为个
  • spring学习——xml文件的配置 a-john spring
    在Spring的学习中，对于其xml文件的配置是必不可少的。在Spring的多种装配Bean的方式中，采用XML配置也是最常见的。以下是一个简单的XML配置文件： <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.springframework.or
  • HDU 4342 History repeat itself 模拟 aijuans 模拟
    来源：http://acm.hdu.edu.cn/showproblem.php?pid=4342 题意：首先让求第几个非平方数，然后求从1到该数之间的每个sqrt(i)的下取整的和。 思路：一个简单的模拟题目，但是由于数据范围大，需要用__int64。我们可以首先把平方数筛选出来，假如让求第n个非平方数的话，看n前面有多少个平方数，假设有x个，则第n个非平方数就是n+x。注意两种特殊情况，即
  • java中最常用jar包的用途 asia007 java
    java中最常用jar包的用途 jar包用途axis.jarSOAP引擎包commons-discovery-0.2.jar用来发现、查找和实现可插入式接口，提供一些一般类实例化、单件的生命周期管理的常用方法.jaxrpc.jarAxis运行所需要的组件包saaj.jar创建到端点的点到点连接的方法、创建并处理SOAP消息和附件的方法，以及接收和处理SOAP错误的方法.  w
  • ajax获取Struts框架中的json编码异常和Struts中的主控制器异常的解决办法 百合不是茶 jsjson编码返回异常
    一:ajax获取自定义Struts框架中的json编码  出现以下 问题:       1,强制flush输出  json编码打印在首页 2, 不强制flush js会解析json 打印出来的是错误的jsp页面   却没有跳转到错误页面 3,  ajax中的dataType的json 改为text 会
  • JUnit使用的设计模式 bijian1013 java设计模式JUnit
    JUnit源代码涉及使用了大量设计模式 1、模板方法模式（Template Method）         定义一个操作中的算法骨架，而将一些步骤延伸到子类中去，使得子类可以不改变一个算法的结构，即可重新定义该算法的某些特定步骤。这里需要复用的是算法的结构，也就是步骤，而步骤的实现可以在子类中完成。   
  • Linux常用命令（摘录） sunjing crondchkconfig
    chkconfig --list   查看linux所有服务 chkconfig --add servicename 添加linux服务 netstat -apn | grep 8080  查看端口占用 env 查看所有环境变量 echo $JAVA_HOME 查看JAVA_HOME环境变量   安装编译器 yum install -y gcc
  • 【Hadoop一】Hadoop伪集群环境搭建 bit1129 hadoop
     结合网上多份文档，不断反复的修正hadoop启动和运行过程中出现的问题，终于把Hadoop2.5.2伪分布式安装起来，跑通了wordcount例子。Hadoop的安装复杂性的体现之一是，Hadoop的安装文档非常多，但是能一个文档走下来的少之又少，尤其是Hadoop不同版本的配置差异非常的大。Hadoop2.5.2于前两天发布，但是它的配置跟2.5.0，2.5.1没有分别。 &nb
  • Anychart图表系列五之事件监听 白糖_ chart
    创建图表事件监听非常简单：首先是通过addEventListener('监听类型',js监听方法)添加事件监听，然后在js监听方法中定义具体监听逻辑。 以钻取操作为例，当用户点击图表某一个point的时候弹出point的name和value，代码如下： <script> //创建AnyChart var chart = new AnyChart(); //添加钻取操作&quo
  • Web前端相关段子 braveCS web前端
    Web标准：结构、样式和行为分离   使用语义化标签 0）标签的语义：使用有良好语义的标签，能够很好地实现自我解释，方便搜索引擎理解网页结构，抓取重要内容。去样式后也会根据浏览器的默认样式很好的组织网页内容，具有很好的可读性，从而实现对特殊终端的兼容。 1）div和span是没有语义的：只是分别用作块级元素和行内元素的区域分隔符。当页面内标签无法满足设计需求时，才会适当添加div
  • 编程之美-24点游戏 bylijinnan 编程之美
    import java.util.ArrayList; import java.util.Arrays; import java.util.HashSet; import java.util.List; import java.util.Random; import java.util.Set; public class PointGame { /**编程之美
  • 主页面子页面传值总结 chengxuyuancsdn 总结
    1、showModalDialog returnValue是javascript中html的window对象的属性,目的是返回窗口值,当用window.showModalDialog函数打开一个IE的模式窗口时,用于返回窗口的值 主界面 var sonValue=window.showModalDialog("son.jsp"); 子界面 window.retu
  • [网络与经济]互联网+的含义 comsci 互联网+
          互联网+后面是一个人的名字 = 网络控制系统       互联网+你的名字 =  网络个人数据库       每日提示:如果人觉得不舒服,千万不要外出到处走动,就呆在床上,玩玩手游,更不能够去开车,现在交通状况不
  • oracle 创建视图 with check option daizj 视图vieworalce
    我们来看下面的例子： create or replace view testview as select empno,ename from emp where ename like ‘M%’ with check option; 这里我们创建了一个视图，并使用了with check option来限制了视图。 然后我们来看一下视图包含的结果： select * from testv
  • ToastPlugin插件在cordova3.3下使用 dibov Cordova
        自己开发的Todos应用，想实现“ 再按一次返回键退出程序 ”的功能，采用网上的ToastPlugins插件，发现代码或文章基本都是老版本，运行问题比较多。折腾了好久才弄好。下面吧基于cordova3.3下的ToastPlugins相关代码共享。       ToastPlugin.java package&nbs
  • C语言22个系统函数 dcj3sjt126com cfunction
    C语言系统函数一、数学函数下列函数存放在math.h头文件中Double floor(double num) 求出不大于num的最大数。Double fmod(x, y) 求整数x/y的余数。Double frexp(num, exp); double num; int *exp; 将num分为数字部分（尾数）x和 以2位的指数部分n，即num=x*2n，指数n存放在exp指向的变量中，返回x。D
  • 开发一个类的流程 dcj3sjt126com 开发
    本人近日根据自己的开发经验总结了一个类的开发流程。这个流程适用于单独开发的构件，并不适用于对一个项目中的系统对象开发。开发出的类可以存入私人类库，供以后复用。   以下是开发流程： 1. 明确类的功能，抽象出类的大概结构 2. 初步设想类的接口 3. 类名设计（驼峰式命名） 4. 属性设置(权限设置) 判断某些变量是否有必要作为成员属
  • java 并发 shuizhaosi888 java 并发
    能够写出高伸缩性的并发是一门艺术   在JAVA SE5中新增了3个包 java.util.concurrent java.util.concurrent.atomic java.util.concurrent.locks 在java的内存模型中，类的实例字段、静态字段和构成数组的对象元素都会被多个线程所共享，局部变量与方法参数都是线程私有的，不会被共享。
  • Spring Security（11）——匿名认证 234390216 Spring SecurityROLE_ANNOYMOUS匿名
    匿名认证 目录 1.1     配置 1.2     AuthenticationTrustResolver          对于匿名访问的用户，Spring Security支持为其建立一个匿名的AnonymousAuthenticat
  • NODEJS项目实践0.2[ express,ajax通信...] 逐行分析JS源代码 Ajaxnodejsexpress
      一、前言         通过上节学习，我们已经        ubuntu系统搭建了一个可以访问的nodejs系统，并做了nginx转发。本节原要做web端服务 及 mongodb的存取，但写着写着，web端就
  • 在Struts2 的Action中怎样获取表单提交上来的多个checkbox的值 lhbthanks javahtmlstrutscheckbox
    第一种方法：获取结果String类型 在 Action 中获得的是一个 String 型数据，每一个被选中的 checkbox 的 value 被拼接在一起，每个值之间以逗号隔开(,)。 所以在 Action 中定义一个跟 checkbox 的 name 同名的属性来接收这些被选中的 checkbox 的 value 即可。 以下是实现的代码： 前台 HTML 代码：
  • 003.Kafka基本概念 nweiren hadoopkafka
    Kafka基本概念：Topic、Partition、Message、Producer、Broker、Consumer。 Topic：             消息源（Message）的分类。 Partition：             Topic物理上的分组，一
  • Linux环境下安装JDK roadrunners jdklinux
    1、准备工作 创建JDK的安装目录： mkdir -p /usr/java/   下载JDK，找到适合自己系统的JDK版本进行下载： http://www.oracle.com/technetwork/java/javase/downloads/index.html   把JDK安装包下载到/usr/java/目录，然后进行解压： tar -zxvf jre-7
  • Linux忘记root密码的解决思路 tomcat_oracle linux
    1：使用同版本的linux启动系统，chroot到忘记密码的根分区passwd改密码 　　2：grub启动菜单中加入init=/bin/bash进入系统，不过这时挂载的是只读分区。根据系统的分区情况进一步判断. 　　3: grub启动菜单中加入 single以单用户进入系统. 　　4:用以上方法mount到根分区把/etc/passwd中的root密码去除 　　例如: 　　ro
  • 跨浏览器 HTML5 postMessage 方法以及 message 事件模拟实现 xueyou jsonpjquery框架UIhtml5
    postMessage 是 HTML5 新方法，它可以实现跨域窗口之间通讯。到目前为止，只有 IE8+, Firefox 3, Opera 9, Chrome 3和 Safari 4 支持，而本篇文章主要讲述 postMessage 方法与 message 事件跨浏览器实现。postMessage 方法 JSONP 技术不一样，前者是前端擅长跨域文档数据即时通讯，后者擅长针对跨域服务端数据通讯，p
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他