Lovejulyer
Lovejulyer

前端实践--JavaScript--控制类名（className 属性）+改变样式

通过className属性来设置元素的样式:

  • 给id=”p1”元素通过className添加”类名为one”的样式。当点击”添加样式”按钮，第一段文字添加样式。

  • 给id=”p2”元素通过className修改为”类名为two”的样式。当点击”更改外观”按钮，第二段文字更改样式。

代码：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>className属性</title>
<style> body{ font-size:16px;} .one{ border:1px solid #eee; width:230px; height:50px; background:#ccc; color:red; } .two{ border:1px solid #ccc; width:230px; height:50px; background:#9CF; color:blue; } </style>
</head>
<body>
    <p id="p1" > JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="添加样式" onclick="add()"/>
    <p id="p2" class="one">JavaScript使网页显示动态效果并实现与用户交互功能。</p>
    <input type="button" value="更改外观" onclick="modify()"/>

    <script type="text/javascript"> function add(){ var p1 = document.getElementById("p1"); p1.className="one"; } function modify(){ var p2 = document.getElementById("p2"); p2.className="two"; } </script>
</body>
</html>

设置前演示效果：

前端实践--JavaScript--控制类名（className 属性）+改变样式_第1张图片

设置后演示效果：

前端实践--JavaScript--控制类名（className 属性）+改变样式_第2张图片

任务来源：慕课网- - 《JavaScript 入门》 - - 控制类名（className 属性）

编写”改变颜色”、”改变宽高”、”隐藏内容”、”显示内容”、”取消设置”的函数，点击相应按钮执行相应操作，点击”取消设置”按钮后，提示是否取消设置，如是执行操作，否则不做操作。

代码：

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="txttent-Type" txttent="text/html; charset=utf-8" />
<title>javascript</title>
<style type="text/css"> body{font-size:12px;} #txt{ height:400px; width:600px; border:#333 solid 1px; padding:5px;} p{ line-height:18px; text-indent:2em;} </style>
</head>
<body>
  <h2 id="con">JavaScript课程</H2>
  <div id="txt"> 
     <h5>JavaScript为网页添加动态效果并实现与用户交互的功能。</h5>
        <p>1. JavaScript入门篇，让不懂JS的你，快速了解JS。</p>
        <p>2. JavaScript进阶篇，让你掌握JS的基础语法、函数、数组、事件、内置对象、BOM浏览器、DOM操作。</p>
        <p>3. 学完以上两门基础课后，在深入学习JavaScript的变量作用域、事件、对象、运动、cookie、正则表达式、ajax等课程。</p>
  </div>
  <form>
  <!--当点击相应按钮，执行相应操作，为按钮添加相应事件-->
    <input type="button" value="改变颜色" onclick="set.changeColor()">  
    <input type="button" value="改变宽高" onclick="set.changeSize()">
    <input type="button" value="隐藏内容" onclick="set.objHide()">
    <input type="button" value="显示内容" onclick="set.objShow()">
    <input type="button" value="取消设置" onclick="set.offSet()">
  </form>
  <script type="text/javascript"> var txt=document.getElementById("txt"); var set={ changeColor:function(){ txt.style.color="red"; txt.style.backgroundColor="#ccc"; }, changeSize:function(){ txt.style.width="300px"; txt.style.height="300px"; }, objHide:function(){ txt.style.display="none"; }, objShow:function(){ txt.style.display="block"; }, offSet:function(){ var message=confirm("你确定要重置所有设置么？"); if(message==true){ txt.removeAttribute('style'); } } } </script>
</body>
</html>

设置前演示效果：

前端实践--JavaScript--控制类名（className 属性）+改变样式_第3张图片

设置后演示效果：

  • 改变颜色：
    前端实践--JavaScript--控制类名（className 属性）+改变样式_第4张图片

  • 改变宽高：
    前端实践--JavaScript--控制类名（className 属性）+改变样式_第5张图片

  • 隐藏内容：
    前端实践--JavaScript--控制类名（className 属性）+改变样式_第6张图片

任务来源：慕课网- - 《JavaScript 入门》- - 编程挑战

你可能感兴趣的:(前端实践)

  • 第一章 微前端介绍与背景 球球不吃虾 微前端前端
    文章目录微前端介绍与背景什么是微前端？微前端的主要特点微前端的起源与发展微前端解决的主要问题1.代码库庞大且复杂2.技术栈单一且僵化3.开发、测试和部署效率低下4.可扩展性差案例分析：某电商平台的微前端实践主要组件解释微前端介绍与背景随着Web应用日益复杂和庞大，传统的前端开发模式开始面临一系列挑战。在这样的背景下，微前端（MicroFrontends）作为一种新兴的前端架构风格，逐渐受到开发者的
  • nginx反向代理解决跨域前端实践 Beauty_z nginxjs
    需求实现本地请求百度的一个搜索接口，用nginx代理解决跨域思路：前端和后端都用nginx代理到同一个地址8080，这样访问接口就不存在跨域限制本地页面查询一个百度搜索接口，运行在http://localhost:8035index.jsconstpath='/s?ie=utf-8&mod=1&isbd=1&isid=32E40E4954198269&ie=utf-8&f=8&rsv_bp=1&r
  • 微前端应用及基于qiankun的微前端实践 东扯葫芦西扯瓜 jsvuejsvue.js
    示例代码仓库：yl-qiankun-base:https://gitee.com/dongche/yl-qiankun-base.gityl-qiankun-child-vue:https://gitee.com/dongche/yl-qiankun-child-vue.git微前端概念起源微前端概念最早其实是借鉴了微服务的概念，最早是出现在2016年的ThoughtWorksTechnology
  • vue+qiankun微前端实践 单眼皮的小熊 vue前端vue.jsjavascript
    qiankun（https://qiankun.umijs.org/zh/guide/getting-started）基座也可以用多种脚手架搭建（此处以vue2.x为例）：vue-cli搭建vue2.x项目，然后安装qiankun：$yarnaddqiankun#ornpmiqiankun-S基座配置：我们将子应用的配置都放在：main/src/micro-app.js下：constmicroAp
  • 前端开发知识点整理 weixin_34301307 前端后端数据库ViewUI
    目录专业技能前端理论浏览器HTMLCSSJavaScript编程通用SEO数据统计数据分析网络基础交叉领域理论产品设计相关后端基础前端实践解决实际问题学习型项目前端工程第一阶段：框架应用第二阶段：简单自动构建优化第三阶段：JS/CSS模块化开发第四阶段：组件化开发与资源管理项目技术选型造轮子版本规划致谢联系方式结语许可专业技能前端理论浏览器浏览器内核渲染原理HTML解析器CSS解析器JavaScr
  • 微前端之single-spa 只管去努力 前端
    single-spa前言single-spa是啥single-spa实战总结前言其实早就想写一篇关于微前端实践的文章了，几个月之前就看过有关微前端的视频，也查过一些文档，但是好像没有总结，现在又忘记一些了，今天实操了一遍，这里就总结一下，正好实习公司工作小组项目采用的就是微前端。今天先讲解一下single-spa，后面在讲解qiankun。插曲：今天本来跟着别人一起敲代码，但是发现使用vue-cl
  • Blazor在IoT领域的前端实践 @.NET开发者日 MASA team 前端
    2023年3月11号，MASA技术团队参加了“.NET开发者日”，IoT项目经理郭浩在活动中做“Blazor在IoT领域的前端实践”的主题分享郭浩数闪科技IoT项目经理从事.NET开发10余年，目前在数闪科技担任IoT项目经理，有大量IoT产品的开发经验，在Android和iOS的BlazorMAUI开发上有大量实践经验。本次分享主要分为两个部分第一部分我们为什么要在IoT项目中使用Blazor技
  • 【数据中台商业化】数据中台微前端实践 2301_76429513 前端
    一，需求背景1业务背景在以往的业务场景中，用户进入五花八门的菜单体系中，往往会产生迷茫情绪，难以理解平台名称及具体作用，导致数据开发与管理学习成本较高，降低工作效率。为此我们整合从数据接入，数据开发，数据管理的全链路流程，期望让用户体验一站式数据开发与管理的便捷性；并提供不同业务场景，方便根据业务场景进行进一步数据开发与管理工作，为数据应用平台打下夯实规范的数据基础，方便用户在数据平台里，对于数据
  • 微前端实践一 yolkpie
    微前端起源微前端的概念最早由thoughtworks在2016年提出。其核心思路是借鉴后端微服务架构理念，将一个单体的庞大的前端应用拆分为多个简单独立的前端工程。每个前端工程可以独立开发、测试、部署。最终再由一个容器应用，将拆分后的微前端工程组合为一个整体，面向用户提供服务微前端的价值技术栈无关主框架不限制接入应用的技术栈，子应用具备完全自主权独立开发、独立部署子应用仓库独立，前后端可独立开发，部
  • Vite+React前端实践 非著名coder javascriptreact.jsjavascriptvite
    Vite+React前端实践2021年2月17日，Vite2.0发布了，在前端圈引起了不小的轰动。至于引起轰动的原因恐怕要数官网上介绍的这几点原因：去掉打包步骤，快速的冷启动。及时的模块热更新，不会随着模块变多而使得热更新变慢。真正的按需编译。Vite是基于浏览器native的ESmodule开发的，基于Bundleless思想。在了解Vite前，需要先了解Bundle和Bundleless。Bu
  • 基于云原生的大数据产品前端实践 | 第七期图文直播文字回放 LinkTime_Cloud 可视化大数据编程语言hadoop人工智能
    点击“蓝字”关注我们2月5日晚，智领云第七次社群图文技术直播如约而至。本次直播由智领云Web开发经理陈磊为大家分享了《基于云原生的大数据产品前端实践》主题内容，其中主要内容包括：BDOS前端架构演进，前端工程体系建设，数据可视化实践，前端能力中台化探索等。大数据系统BDOS的整体架构在了解基于云原生的大数据产品前端实践之前，先为大家介绍一下大数据系统BDOS的整体架构，BDOS是基于云原生的容器化
  • 【数据中台商业化】数据中台微前端实践 数据中台微前端前端程序员业务
    作者：京东科技陈云飞一，需求背景1业务背景在以往的业务场景中，用户进入五花八门的菜单体系中，往往会产生迷茫情绪，难以理解平台名称及具体作用，导致数据开发与管理学习成本较高，降低工作效率。为此我们整合从数据接入，数据开发，数据管理的全链路流程，期望让用户体验一站式数据开发与管理的便捷性；并提供不同业务场景，方便根据业务场景进行进一步数据开发与管理工作，为数据应用平台打下夯实规范的数据基础，方便用户在
  • 【微前端实践】webpack5 + Node.js+ Nacos 搭建微前端应用网络 节省钱 webpack微前端Nodejsnode.jswebpack前端框架前端javascript
    一、关于Nacos什么是Nacos?官方介绍https://nacos.io/zh-cn/docs/what-is-nacos.htmlNacos致力于帮助您发现、配置和管理微服务。Nacos提供了一组简单易用的特性集，帮助您快速实现动态服务发现、服务配置、服务元数据及流量管理。Nacos帮助您更敏捷和容易地构建、交付和管理微服务平台。Nacos是构建以“服务”为中心的现代应用架构(例如微服务范式
  • qiankun微前端实践 Y了个J
    微前端的好处：1.技术栈无关，各个子项目可以自由选择框架，可以自己制定开发规范。2.快速打包，独立部署，互不影响，升级简单。3.可以很方便的复用已有的功能模块，避免重复开发。创建qiankun主项目npxcreate-react-appqiankun-main--templatetypescriptcdqiankun-mainyarnaddqiankun#或者npmiqiankun-S修改inde
  • 微前端实践初试 我们都是架构师
    ——一个基于single-spa的vue2升级至vue3的项目Author柯雨Date2021-01-21一、项目背景随着2020年9月vue3的正式发布，为了在之后的工作之中能够逐步全面的使用vue3替代vue2，之前所开发的系统项目升级的需求也就提上了日程。考虑到第一，vue3的使用是新技术的尝试，第二，vue3的相关生态还在进一步完善之中，因此，我们使用了一个部门内部项目来作为我们的实践对象
  • vue+ts的微前端实践 夜闯寡妇门
    微前端的概念是从后端的微服务中迁移过来的。将Web应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立运行、独立开发、独立部署qiankun是阿里巴巴基于single-spa实现的微前端库，是一个开放式微前端架构，支持当前三大前端框架甚至jq等其他项目无缝接入。微前端待解决的问题微前端主应用与子应用如何构建主应用资源下发给子应用各应用间动态通信，实时监听，同步数据微前端
  • 服务 24 亿级用户 App 的大前端实践！ weixin_38754349 人工智能java大数据编程语言移动开发
    作者|万佳茄子科技（海外SHAREitGroup）是国内出海的先行者，2015年成立后就“走出去”。2017年，主要产品SHAREit（国内茄子快传）全球用户总量超12亿，成为新兴市场的“国民应用”。截止目前，茄子科技产品矩阵全球累计安装用户量近24亿，覆盖200多个国家和地区，涵盖全球45种语言。服务全球几十亿用户，茄子科技如何提升App的用户体验？怎样解决App的崩溃问题？如何应对海外复杂的网
  • 美团点评高性能跨平台动态化框架-Picasso DevolperFront
    点击上方“开发者技术前线”，选择“星标”13：21在看真爱转载声明：本文转载自「美团点评技术博客」背景Picasso是大众点评移动研发团队自研的高性能跨平台动态化框架，经过两年多的孕育和发展，目前在美团多个事业群已经实现了大规模的应用。Picasso源自我们对大前端实践的重新思考，以简洁高效的架构达成高性能的页面渲染目标。在实践中，甚至可以把Native技术向Picasso技术的迁移当做一种性能优
  • BI前端实践9：由DQL支持的关联多维分析 润乾软件 报表&BIbi多维分析数据分析
    实践目标定义完元数据，部署到DQLServer后，再进行多维分析(OLAP)时，体会后续界面操作、概念理解上的难易，探究DQL查询语言对多维分析的实际提升效果；同时，进一步探测DQL查询能力的完备性。融入关联关系的元数据树上一节设置了关联关系的元数据orders.lmd中，表名、字段名设置成中文语义：部署到DQLServer中，在WEB多维分析系统里针对它做多维分析，能看到元数据中设置的关联关系已
  • Vue qiankun微前端实现详解
    目录引言What：微前端是什么Why：为什么选择微前端微前端能做到什么为什么不使用iFrameHow：微前端实践在主应用中注册微应用在子应用导出相应的生命周期钩子结尾引言前端时间有个契机，让我们团队开始进行微前端的相关实践。最近正好有些成果了，来一个阶段性的总结，也方便后续进一步的开发。可能第一次听说微前端的同学都会不明觉厉，那么ta到底是个啥？本章会从以下3个角度阐述我的理解：What：微前端是
  • registermodule 微前端_微前端实践 weixin_40009207 registermodule微前端
    在toB的前端开发工作中，我们往往就会遇到如下困境：工程越来越大，打包越来越慢团队人员多，产品功能复杂，代码冲突频繁、影响面大内心想做SaaS产品，但客户总是要做定制化不同的团队可能有不同的方法去解决这些问题。在前端开发日新月异、前端工程化蓬勃发展的今天，我想给大家介绍下另一种尝试——微前端。微前端是什么那什么是微前端？微前端主要是借鉴后端微服务的概念。简单地说，就是将一个巨无霸(Monolith
  • BI 前端实践 17：DBD 实践 润乾软件 报表&BIbiDashboard
    实践目标一个DBD(又称Dashboard、仪表盘)，是通过多维分析(OLAP)的方式制作多个表格报表、统计图报表，同时与参数控件混合展示的一个复杂数据视图。它可能依赖多个数据集。这些DBD元素并不是简单的叠加，而是互相关联的。从业务角度看，每个图、表分别体现同一个主题的不同侧面；局部单个图表与整体的外观风格协调一致；共享参数作用于多个图表，实现整体联动。本篇通过制作一个完整的DBD，逐步体验这个
  • BI 前端实践 8：关联查询语言──DQL 润乾软件 计算&AIbi报表工具数据可视化dashboard数据分析
    实践目标通过对比DQL及它翻译出的SQL，初步认识DQL，体会它怎么支持有关联（JOIN）的多维分析。认识DQL观察上一节最后一个多维分析例子，前端分析时，DQL服务器上会打印出这样的日志：能看到提交到DQL服务器的查询语句是DQL，和SQL语法有区别。DQL服务器把它翻译出来成SQL后，才去原始数据库执行获得数据。原始数据库被DQL服务器包裹起来隐藏掉，并且更换了一种新的查询语言。这样的结构令人
  • BI 前端实践 7：预定义语义层改善 SQL 做多维分析 润乾软件 报表&BIbi报表工具数据可视化dashboard数据分析
    实践目标偶尔用SQL做多维分析会比较方便，但如果经常做这类事务，每次都可能写重复的SQL，就会存在麻烦，通过使用预定义的语义层改善这些问题。基于SQL做多维分析的烦恼l数据库中的表名、字段名几乎都是英文，甚至是缩略字母，每次都需要用AS转成中文的业务名。l时不时会有一些计算字段，用到时每次都要编写计算表达式。l事实表中只有代码值，对应的名称值经常是存储在另外的维表中，每次要写JOIN。预定义元数据
  • 前端实践小项目(二)表格隔行换色与秒表(含有源代码) 一个名叫追的程序猿 前端jquery前端javascriptcsshtml
    目录开头表格换行秒表开头哈喽~大家好！这篇呢我们来看看前端实践小项目第二篇“表格隔行换色与秒表”。首先我们先来看效果。表格换行首先我们先来看表格隔行换色，这里同样是给出JS代码与JQuery代码。思路：准备表格：表头（thead）和表体（tbody）绑定事件：加载事件onload()获取元素：获取表格document.getElementById()获取行的长度：表体中tr的数量len遍历：for
  • 微前端应用及基于qiankun的微前端实践 东扯葫芦西扯瓜
    示例代码仓库：yl-qiankun-base:https://gitee.com/dongche/yl-qiankun-base.gityl-qiankun-child-vue:https://gitee.com/dongche/yl-qiankun-child-vue.git微前端概念起源微前端概念最早其实是借鉴了微服务的概念，最早是出现在2016年的ThoughtWorksTechnology
  • vivo 商品中台的可视化微前端实践 前端可视化
    一、背景在电商领域内，商品是一个重要组成部分，与其对应的商品管理系统，则负责商品的新建、编辑、复制等功能。随着商品管理系统的成熟稳定和业务上的扩展需求，催化出了商品中台的诞生。它可以将现有商品功能最大效率的复用在很多业务上（公司内业务、公司外业务等）。而不是仅限于当前团队的业务使用。在设计商品中台的前端系统时，我们使用了微前端和可视化技术，其可以达到如下效果：可视化技术可以让各个业务方的运营等相关
  • vivo 商品中台的可视化微前端实践 vivo互联网技术
    一、背景在电商领域内，商品是一个重要组成部分，与其对应的商品管理系统，则负责商品的新建、编辑、复制等功能。随着商品管理系统的成熟稳定和业务上的扩展需求，催化出了商品中台的诞生。它可以将现有商品功能最大效率的复用在很多业务上（公司内业务、公司外业务等）。而不是仅限于当前团队的业务使用。在设计商品中台的前端系统时，我们使用了微前端和可视化技术，其可以达到如下效果：可视化技术可以让各个业务方的运营等相关
  • 「微前端实践」使用Vue+qiankun微前端方案重构老项目的本地验证 yinmochunCoder
    10月份换了新的工作，参与完一个月的需求迭代后，接到了项目重构的任务。简单来说，需要在短时间内提出方案设想，同时进行本地验证，最终需要拿出一套技术替换方案来。于是，埋头苦干了一个月，总算干了点成绩出来，今天把当时的思考和实践做个简单总结，就当是个复盘吧。一、老项目现状最初接触到的老项目，使用到的前端技术栈主要是（jQuery1.8+layui-v2.5.4+ExtJS4.2.1.883），当时拿到
  • Svg 前端实践总结 FayHu
    SVG意为可缩放矢量图形（ScalableVectorGraphics）。SVG使用XML格式定义图像。本文是学习和使用svg的一些总结，不介绍svg作图的方法。svg标签元素参考：MDN-svg结构化标签也可参考：SVG中的结构化、分组和引用元素svg的icon方案，参考：腾讯干货！超实用的高清图标SVG解决方案全总结（下）一、通过js生成svg元素svg与普通html元素不同，需要指定命名空间
  • 统一思想认识 永夜-极光 思想
    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其他