pradosoul
pradosoul

JavaScript & DOM 学习笔记（四）

案例：将整个图片库的浏览连接几种安排在图片库主页里，在用户点击某个图片链接时才把相应的图片传送出来。

    图片素材： 将图片素材 存放入 images文件夹中，并将文件夹与 html 放在同一级目录下。

JavaScript & DOM 学习笔记（四）JavaScript & DOM 学习笔记（四）

JavaScript & DOM 学习笔记（四）

JavaScript & DOM 学习笔记（四）

JavaScript & DOM 学习笔记（四）

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Image Gallery</title>
</head>
<body>
  <h1>Snapshots</h1>
  <ul>
    <li>
      <a href="images/fireworks.jpg" title="A fireworks display">Fireworks</a>
    </li>
    <li>
      <a href="images/coffee.jpg" title="A cup of black coffee">Coffee</a>
    </li>
    <li>
      <a href="images/rose.jpg" title="A red, red rose">Rose</a>
    </li>
    <li>
      <a href="images/bigben.jpg" title="The famous clock">Big Ben</a>
    </li>
  </ul>
</body>
</html>

    如果图片已经排好顺序，可以用 有序清单元素 <ol> 来标记这些图片链接。

    这样这个网页就做好了，但是如果想浏览不同的图片，就需要借助 浏览器的后退按钮。可以做如下改进：

        a. 通过增加一个“占位符”图片的办法在这个主页上为图片预留一个浏览区域

        b. 点击某个图片的链接时，拦截网页的默认行为（跳转到图片页面），并将图片显示在“占位符”图片

    将代码： <img id="placeholder" src="images/placeholder.gif" alt="my image gallery" /> 插入到 </ul> 后。效果图如下：

    下面要编写 JavaScript 代码来实现 显示图片了。

     建议将 JavaScript 代码写入单独的 .js 文件，在 html 文档中应用。我们新建一个 showPic.js 并放入 html 文档的 相同目录下的 scripts 文件夹中。代码如下：

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Image Gallery</title>
</head>
<body>
  <h1>Snapshots</h1>
  <ul>
    <li>
      <a href="images/fireworks.jpg" title="A fireworks display" onClick="showPic(this);return false;">Fireworks</a>
    </li>
    <li>
      <a href="images/coffee.jpg" title="A cup of black coffee" onClick="showPic(this);return false;">Coffee</a>
    </li>
    <li>
      <a href="images/rose.jpg" title="A red, red rose" onClick="showPic(this);return false;">Rose</a>
    </li>
    <li>
      <a href="images/bigben.jpg" title="The famous clock" onClick="showPic(this);return false;">Big Ben</a>
    </li>
  </ul>
  <img id="placeholder" src="images/placeholder.gif" alt="my image gallery" />
  
  <script type="text/javascript" src="scripts/showPic.js"></script>
</body>
</html>
function showPic(whichPic) {
	var placeholder = document.getElementById("placeholder");
	var picSrc = whichPic.getAttribute("href");
	placeholder.setAttribute("src", picSrc);
}

    若一个站点用到多个 JavaScript 文件，为了减少对站点的请求次数（提高性能），应该尽量把这些 .js 文件 合并到一个文件中。

    上面代码中使用到了 onclick 事件处理函数，并且在使用函数 showPic（this）时使用了 this 关键字，this 代表了 <a> 这个元素节点。同时我们应该注意到，在showPic（）函数后面，我们增加了 return=false; 代码，这是为了 阻止 链接被点击时跳转的默认行为。

    事件处理函数的工作机制：在给某个元素添加了事件处理函数后，一旦事情发生，相应的 JavaScript 代码就会被执行。被调用的 JavaScript 代码可以返回一个值，这个值将被传递给那个事件处理函数。所以上面我们使用 return=false; 来阻止跳转到链接窗口。

    下面我们给 显示的图片加一个文本描述，每次点击图片的时候，将图片的 title 显示出来。在“占位符”图片下面加一个 <p>元素：

<p id="description">Choose a image</p>

    使用 前一篇 中的 childNodes、nodeValue、firstChild 等元素属性来 改变 description。在 showPic.js 的 showPic function 中做出修改。

function showPic(whichPic) {
	//show picture
	var placeholder = document.getElementById("placeholder");
	var picSrc = whichPic.getAttribute("href");
	placeholder.setAttribute("src", picSrc);
	
	//replace description of image
	var text = whichPic.getAttribute("title");
	var description = document.getElementById("description");
	description.firstChild.nodeValue = text;
}

如果想让图片库更美观，可以加入以下 css 样式表，并在 <head> 中加入 <link> 标签引入样式。

link rel="stylesheet" type="text/css" href="styles/layout.css"/>
body {
  font-family: "Helvetica","Arial",serif;
  color: #333;
  background-color: #ccc;
  margin: 1em 10%;
}
h1 {
  color: #333;
  background-color: transparent;
}
a {
  color: #c60;
  background-color: transparent;
  font-weight: bold;
  text-decoration: none;
}
ul {
  padding: 0;
}
li {
  float: left;
  padding: 1em;
  list-style: none;
}
img {
  display:block;
  clear: both;
}


你可能感兴趣的:(JavaScript,css,onclick,事件处理,元素获取,的使用)

  • LangChain入门：使用Python和通义千问打造免费的Qwen大模型聊天机器人 南七小僧 人工智能网站开发AI技术产品经理服务器数据库windows
    前言LangChain是一个用于开发由大型语言模型（LargeLanguageModels，简称LLMs）驱动的应用程序的框架。它提供了一个灵活的框架，使得开发者可以构建具有上下文感知能力和推理能力的应用程序，这些应用程序可以利用公司的数据和APIs。这个框架由几个部分组成。LangChain库：Python和JavaScript库。包含了各种组件的接口和集成，一个基本的运行时，用于将这些组件组合
  • Unity3D手游多分辨率适配深度解决方案 晴空了无痕 项目解决方案屏幕适配
    一、适配核心问题剖析当前移动端设备分辨率呈现多元化发展趋势，主流设备分辨率跨度从720P到4K级别，屏幕宽高比包含16:9、18:9、19.5:9、21:9等多种形态。适配难点主要体现在：UI元素错位：传统固定锚点布局在不同宽高比下出现显示异常画面比例失调：等比缩放导致屏幕空间浪费或内容裁切性能与效果平衡：高分辨率设备资源消耗与低端设备性能瓶颈异形屏适配：刘海屏、挖孔屏等特殊屏幕形态的兼容处理二、
  • mysql 统计同一字段不同值的个数 liudachu Mysql数据库mysql
    在一个项目中,制作呃echart图表的时候，遇到一个需求，需要从后端接口获取数据----售票员的姓名和业绩所以需要在订单表中，获取不同售票员的订单数量。订单表解决方案汇总MySQL统计一个列中不同值的数量需求：MySQL统计一个列中不同值的数量，其中origin是用户来源，其中的值有iPhone、Android、Web三种，现在需要分别统计由这三种渠道注册的用户数量。方案1:SELECTcount
  • 数仓建模—Data Warebase AI 时代数据平台应当的样子 不二人生 数仓建模人工智能数据仓库数仓建模
    DataWarebaseAI时代数据平台应当的样子引言：在这个AI技术飞速发展的时代，我们有能力更深入地发掘数据潜在的价值，而数据处理不应当成为阻碍。云原生分布式DataWarebase将开启处理数据的新范式，它让数据的使用返璞归真，不论是存储还是查询，一个系统满足业务全方位数据需求。打破复杂数据架构的束缚，大大降低数据的使用门槛，释放数据潜能，让数据涌现智能。背景近二十年大数据发展史2002年我
  • numpy学习笔记3：三维数组 np.ones((2, 3, 4)) 的详细解释 宁宁可可 #机器学习#Python基础与进阶numpy学习笔记
    numpy学习笔记3：三维数组np.ones((2,3,4))的详细解释以下是关于三维数组np.ones((2,3,4))的详细解释：1.三维数组的形状形状(2,3,4)表示：最外层维度：2个“层”（或“块”）；中间维度：每个层有3行；最内层维度：每行有4个元素。可以类比为：2本书（外层），每本书有3页（中间层），每页有4行文字（内层）。2.创建全1三维数组代码示例：importnumpyasnp
  • 探索 LangChain、Hugging Face、LM Studio 等 AI 应用工具 Alex程 langchain人工智能
    目录1.LangChainv0.2简介安装概念指南简单试用(1)模型选择(2)基础操作(3)更多操作Runnable调用链的连接Runnable并行自定义函数RunnableLambda额外assign参数(4)langchain.js2.HuggingFace简介如何调用API3.LMStudio简介LMStudio服务器JavaScript/TypeScriptSDK4.Dify.AI简介安装
  • java八股文之常见的集合 qq_45923849 java开发语言
    一、数组的索引为什么从0开始？寻址公式：数组的首地址+索引乘以存储数据的类型大小在根据数组索引获取元素的时候，会用索引和寻址公式来计算内存所对应的元素数据。如果数组的索引从1开始，寻址公式中，就需要增加一次减法操作（数组的首地址-1），对于CPU来说就多了一次指令，性能会降低。二、数组进行查找操作的时间复杂度如果是通过下标，查询的时间复杂度是O(1)如果不通过下标，和使用的查找方式有关–从头往后顺
  • 微信小程序检测滚动到某元素位置的计算方法 萧寂173 微信小程序微信小程序小程序
    wxml{{item}}回到顶部jsPage({data:{arr:['111','222','333','444','555','666','777','888','999','101010','111111','121212','131313','141414'],btnShow:false,//是否显示btntargetViewHeight:0//目标view的高度},onLoad(){th
  • List 和 Set 的区别 不会搬砖的淡水鱼 数据结构listwindows数据结构
    List和Set的区别在Java中，List和Set都是Collection接口的子接口，但它们的存储结构、特点、使用场景不同。对比项List（有序、可重复）Set（无序、不可重复）是否允许重复元素✅允许❌不允许是否有序✅按插入顺序排序❌无序（TreeSet除外）是否可以有null✅允许多个null✅只允许一个null底层数据结构数组、链表哈希表、红黑树访问方式通过索引访问通过iterator遍历
  • Java WebSocket与项目页面（通常是HTML + JavaScript）之间建立连接并传输数据 hh_fine javawebsockethtml
    JavaWebSocket与项目页面（通常是HTML+JavaScript）之间建立连接并传输数据1.创建JavaWebSocket服务器：使用JavaWebSocketAPI创建一个WebSocket服务器端点。2.在HTML页面中使用JavaScript连接WebSocket：通过JavaScript的WebSocketAPI与JavaWebSocket服务器建立连接。3.双向数据传输：实现服
  • Ts学习笔记 初学者7. 学习笔记typescript
    一、Ts与Js区别TsJsJavaScript的超集，用于解决大型项目的代码复杂性一种脚本语言，用于创建动态网页。强类型，支持静态和动态类型动态弱类型语言可以在编译期间发现并纠正错误只能在运行时发现错误不允许改变变量的数据类型变量可以被赋予不同类型的值二、Ts基础类型：boolean,number,string,undefined,null,any,unknown,void，neverany,un
  • Lodash源码分析-every,some,size,includes 初学者7. Loadsh源码分析javascript前端
    collection相关的函数，collection指的是一组用于处理集合（如数组或对象）的工具函数。lodash源码研读之every,some,size,includes一、源码地址GitHub地址:GitHub-lodash/lodash:AmodernJavaScriptutilitylibrarydeliveringmodularity,performance,&extras.官方文档地址
  • Lodash源码分析-uniq,uniqBy,uniqWith 初学者7. Loadsh源码分析javascript前端
    lodash源码研读之uniq,uniqBy,uniqWith一、源码地址GitHub地址:GitHub-lodash/lodash:AmodernJavaScriptutilitylibrarydeliveringmodularity,performance,&extras.官方文档地址:Lodash官方文档二、结构分析uniq,uniqBy,uniqWith基于baseUniq模块。三、函数介
  • 使用bat批量获取WORD中包含对应字符的段落，段落使用回车换行 宇宙无敌花心大萝卜 批处理文档处理word开发语言bat批处理VBS
    get_word_paragraphs.vbs'获取命令行参数IfWScript.Arguments.Count=0ThenWScript.Quit1EndIf'获取Word文档路径docPath=WScript.Arguments(0)'创建Word应用程序对象SetobjWord=CreateObject("Word.Application")objWord.Visible=False'打开W
  • 前端开发：Webpack的使用总结 三掌柜666 web前端知识汇总webpack前端javascript
    前言在前端开发过程中，尤其是现在前端框架的频繁使用的当下，作为前端开发者想必对于Webpack并不陌生，尤其是在使用Vue框架做前端开发的时候，打包时候必用Webpack。还有就是在前端求职面试的时候，Webpack相关的知识点也是面试官必定考察的，那么本篇博文就来分享一下关于Webpack使用相关的知识点，记录下来，方便后期查阅使用。Webpack概念Webpack其实是一个前端资源加载/打包工
  • 《壹起航：15 年助力中国工厂海外获客，开启全球化新篇》 yiqijianzhan 人工智能大数据
    在全球化的汹涌浪潮中，无数中国工厂渴望在海外市场一展宏图。然而，一系列棘手的问题摆在他们面前：怎样成功塑造品牌形象？怎样稳定获取询盘？怎样合理控制营销成本？壹起航，凭借15年深厚的行业积累，整合外贸建站、搜索引擎优化（SEO）以及海外短视频营销等多元服务，为中国工厂开辟出一条轻松拓展海外市场、赢得更多精准订单的便捷之路。一、外贸独立站——企业出海的关键起点在海外市场这片广阔天地里，企业官网不仅是展
  • 【css酷炫效果】纯CSS实现球形阴影效果 冰夏之夜影 css前端
    【css酷炫效果】纯CSS实现球形阴影效果缘创作背景html结构css样式完整代码基础版进阶版(动态版)效果图想直接拿走的老板，链接放在这里：上传后更新缘创作随缘，不定时更新。创作背景刚看到csdn出活动了，赶时间，直接上代码，令人丧气的是：活动的领域有要求，不是发够就行，瞬间意志消沉。html结构css样式.button{background-image:url('a.gif');border-
  • UNI-APP+VUE3+VITE+VSCode开发经验及填坑记录（持续更新ING） 集成显卡 前端项目实践uni-appvscodeide
    uni-app是一个使用Vue.js开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。快速开发模板unibest：最好的uniapp开发框架，由uniapp+Vue3+Ts+Vite5+UnoCss+VSCode(可选webstorm)+uni插件+wot-ui（
  • 大模型时代的知识焦虑 机载软件与适航 机器学习-建模算法-代理模型人工智能大数据
    引言：浪潮之巅，焦虑暗涌大模型时代已经浩荡而来，如同奔腾的浪潮，以令人惊叹的速度重塑着世界的面貌。从智能客服的温声细语，到AI绘画的妙笔生花，再到自动驾驶的日趋成熟，大型语言模型、图像模型等人工智能技术以前所未有的姿态，渗透进我们生活的方方面面。信息获取前所未有的便捷，知识创造空前高效，人机交互焕然一新，一个充满无限可能的智能化未来似乎触手可及。然而，在这令人眼花缭乱的技术盛景之下，一股无形的焦虑
  • python assert()函数 欢天喜地小姐姐 python编程学习python
    1.断言函数作用断言函数是对表达式布尔值的判断，要求表达式计算值必须为真。可用于自动调试。如果表达式为假，触发异常；如果表达式为真，不会报错。2.使用assert判断数组是否相等np.array.any()和numpy.array.all()np.array.any()是或操作，任意一个元素为True，输出为True。np.array.all()是与操作，所有元素为True，输出为True。当我们
  • 【Leetcode刷题随笔】59 螺旋矩阵 Poor_DayDreamer leetcode数组篇MediumTagleetcode矩阵算法
    1.题目描述给定一个正整数n，生成一个包含1到n2所有元素，且元素按顺时针顺序螺旋排列的nxn正方形矩阵matrix。可结合以下原题链接阅读。原题链接：59螺旋矩阵2.解题思路本题为模拟矩阵填充过程，不需要设计算法，只要完成正确的填充过程即可。首先初始化一个nxn的二维矩阵（涉及到动态内存分配），从矩阵左上角开始往顺时针填充，关键在于填充的转角处不要重复填充，所以对于每条边都要遵循严格的统一规则，
  • 【Leetcode刷题随笔】203移除链表元素 Poor_DayDreamer leetcode链表篇leetcode链表算法
    1.题目描述题意：删除链表中等于给定值val的所有节点。示例1：输入：head=[1,2,6,3,4,5,6],val=6输出：[1,2,3,4,5]示例2：输入：head=[],val=1输出：[]示例3：输入：head=[7,7,7,7],val=7输出：[]原题链接：203移除链表元素2.解题思路由于链表本身的性质，移除链表的某个节点a，只需要将前一个节点的next指针指向a的下一个节点即可
  • 【Leetcode刷题随笔】2765最长交替子数组 Poor_DayDreamer leetcode数组篇leetcode算法职场和发展
    1.题目描述：该题目标是在一个整数数组nums中寻找最长的“交替子数组”。这种交替子数组的特点是：其元素按照“递增1，递减1，递增1…”的模式循环排列，且子数组的长度必须大于1，例如数组nums=[2,3,4,3,4]，交替子数组有[2,3]，[3,4]，[3,4,3]和[3,4,3,4]。最长的子数组为[3,4,3,4]，长度为4。详细题目描述见原题：原题。2.1解题思路一（双层循环）：这道题有
  • LeetCode刷题笔记 小李李李李腊八 leetcode算法java
    leetcode_01两数之和斐波那契数列三个数最大乘积反转链表x的平方根环形列表LeetCode随笔两数之和给定一个整数数组nums和一个整数目标值target，请你在该数组中找出和为目标值target的那两个整数，并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是，数组中同一个元素在答案里不能重复出现。你可以按任意顺序返回答案。暴力法记录下数组第一个数值，对数组进行循环，将之后的值
  • 某智慧医养服务平台Uploads存在任意文件上传漏洞(DVB-2025-8968) Byp0ss403 漏洞复现集合文件上传web安全
    免责声明本文所描述的漏洞及其复现步骤仅供网络安全研究与教育目的使用。任何人不得将本文提供的信息用于非法目的或未经授权的系统测试。作者不对任何由于使用本文信息而导致的直接或间接损害承担责任。如涉及侵权，请及时与我们联系，我们将尽快处理并删除相关内容。0x01产品介绍广西金中软件集团有限公司前身成立于1999年，隶属于广西电信下的三产公司金中信息产业有限公司，是一家集软件开发、网站建设、网络工程、系统
  • numpy学习笔记2：ones = np.ones((2, 4)) 的详解 宁宁可可 #机器学习#Python基础与进阶numpypython开发语言
    numpy学习笔记2：ones=np.ones((2,4))的详解np.ones()是NumPy中用于创建全1数组的核心函数，其用法和参数与np.zeros()类似，但生成的数组元素值全部为1。以下是详细解释：1、语法numpy.ones(shape,dtype=float,order='C')作用：生成一个指定形状和数据类型的全1数组。参数：shape：数组的形状，以元组形式传递（如(2,4)表
  • std::move() DDlsss c++网络协议
    std::move是C++中一个用于实现移动语义的标准库函数，它用于将一个左值转换为右值引用。本质上，它并不会移动任何数据，它只是告诉编译器将某个对象当作临时对象（右值）处理。左值:左值是指能够出现在赋值语句左边的对象。它有一个明确的内存地址，并且是可以在多次使用的对象。例如，变量、对象、数组元素等都是左值。例子：intx=5;//x是左值x=10;//可以在赋值操作的左边右值:右值是指临时对象或
  • CSS3背景与渐变 天涯学馆 大前端&移动端全栈架构css3前端css
    背景与渐变background-sizebackground-size属性用于设置背景图像的尺寸。您可以指定绝对或相对单位，或者使用关键词来控制背景图像在元素背景区域中的大小。.element{background-size:[length|percentage|cover|contain]|[length|percentage][length|percentage]|auto|inherit;}
  • 软考 中级软件设计师 考点知识点笔记总结 day05 莫问alicia 软考中级软件设计师笔记算法
    文章目录4、栈和队列4.1、栈的定义4.2、队列定义5、串、数组、矩阵和广义表5.1、串5.2、数组5.3、稀疏矩阵5.4、广义表4、栈和队列4.1、栈的定义线性表是具有相同数据类型的n个数据元素的有限序列，n为表厂。n=0时线性表是一个空表L=（a1,a2,a3,…an）栈是只允许在一端进行插入或删除操作的线性表栈顶允许插入和删除的一端栈顶进栈顶出栈底不允许插入和删除的一端4.2、队列定义队列是
  • duxapp放弃了redux，在duxapp中局部、全局状态的实现方案
    全局状态全局状态是一个很实用的功能，例如管理用户信息，组件间状态共享等功能都需要用到全局状态，react有很多成熟的全局状态管理工具，但是很多写起来太过麻烦，duxapp提供了几种应对不同场景的全局状态的方案，当然如果你需要其他全局状态，可以自行集成局部全局状态这种全局状态方案的使用场景，在于父子组件之间的状态共享import{contextState}from'@/duxapp'import{T
  • Hadoop(一) 朱辉辉33 hadooplinux
    今天在诺基亚第一天开始培训大数据，因为之前没接触过Linux，所以这次一起学了，任务量还是蛮大的。 首先下载安装了Xshell软件，然后公司给了账号密码连接上了河南郑州那边的服务器，接下来开始按照给的资料学习，全英文的，头也不讲解，说锻炼我们的学习能力，然后就开始跌跌撞撞的自学。这里写部分已经运行成功的代码吧.    在hdfs下，运行hadoop fs -mkdir /u
  • maven An error occurred while filtering resources blackproof maven报错
    转：http://stackoverflow.com/questions/18145774/eclipse-an-error-occurred-while-filtering-resources   maven报错： maven An error occurred while filtering resources   Maven -> Update Proje
  • jdk常用故障排查命令 daysinsun jvm
    linux下常见定位命令： 1、jps      输出Java进程       -q       只输出进程ID的名称，省略主类的名称；       -m      输出进程启动时传递给main函数的参数；     &nb
  • java 位移运算与乘法运算 周凡杨 java位移运算乘法
      对于 JAVA 编程中，适当的采用位移运算，会减少代码的运行时间，提高项目的运行效率。这个可以从一道面试题说起：     问题： 用最有效率的方法算出2 乘以8 等於几?” 答案：2 << 3 由此就引发了我的思考，为什么位移运算会比乘法运算更快呢？其实简单的想想，计算机的内存是用由 0 和 1 组成的二
  • java中的枚举(enmu) g21121 java
    从jdk1.5开始，java增加了enum(枚举)这个类型，但是大家在平时运用中还是比较少用到枚举的，而且很多人和我一样对枚举一知半解，下面就跟大家一起学习下enmu枚举。先看一个最简单的枚举类型，一个返回类型的枚举： public enum ResultType { /** * 成功 */ SUCCESS, /** * 失败 */ FAIL,
  • MQ初级学习 510888780 activemq
    1.下载ActiveMQ 去官方网站下载：http://activemq.apache.org/ 2.运行ActiveMQ 解压缩apache-activemq-5.9.0-bin.zip到C盘，然后双击apache-activemq-5.9.0-\bin\activemq-admin.bat运行ActiveMQ程序。 启动ActiveMQ以后，登陆：http://localhos
  • Spring_Transactional_Propagation 布衣凌宇 springtransactional
    //事务传播属性 @Transactional(propagation=Propagation.REQUIRED)//如果有事务，那么加入事务，没有的话新创建一个 @Transactional(propagation=Propagation.NOT_SUPPORTED)//这个方法不开启事务 @Transactional(propagation=Propagation.REQUIREDS_N
  • 我的spring学习笔记12-idref与ref的区别 aijuans spring
    idref用来将容器内其他bean的id传给<constructor-arg>/<property>元素，同时提供错误验证功能。例如： <bean id ="theTargetBean" class="..." /> <bean id ="theClientBean" class=&quo
  • Jqplot之折线图 antlove jsjqueryWebtimeseriesjqplot
    timeseriesChart.html <script type="text/javascript" src="jslib/jquery.min.js"></script> <script type="text/javascript" src="jslib/excanvas.min.js&
  • JDBC中事务处理应用 百合不是茶 javaJDBC编程事务控制语句
      解释事务的概念; 事务控制是sql语句中的核心之一;事务控制的作用就是保证数据的正常执行与异常之后可以恢复   事务常用命令:             Commit提交         
  • [转]ConcurrentHashMap Collections.synchronizedMap和Hashtable讨论 bijian1013 java多线程线程安全HashMap
    在Java类库中出现的第一个关联的集合类是Hashtable，它是JDK1.0的一部分。 Hashtable提供了一种易于使用的、线程安全的、关联的map功能，这当然也是方便的。然而，线程安全性是凭代价换来的――Hashtable的所有方法都是同步的。此时，无竞争的同步会导致可观的性能代价。Hashtable的后继者HashMap是作为JDK1.2中的集合框架的一部分出现的，它通过提供一个不同步的
  • ng-if与ng-show、ng-hide指令的区别和注意事项 bijian1013 JavaScriptAngularJS
            angularJS中的ng-show、ng-hide、ng-if指令都可以用来控制dom元素的显示或隐藏。ng-show和ng-hide根据所给表达式的值来显示或隐藏HTML元素。当赋值给ng-show指令的值为false时元素会被隐藏，值为true时元素会显示。ng-hide功能类似，使用方式相反。元素的显示或
  • 【持久化框架MyBatis3七】MyBatis3定义typeHandler bit1129 TypeHandler
    什么是typeHandler? typeHandler用于将某个类型的数据映射到表的某一列上，以完成MyBatis列跟某个属性的映射   内置typeHandler MyBatis内置了很多typeHandler，这写typeHandler通过org.apache.ibatis.type.TypeHandlerRegistry进行注册，比如对于日期型数据的typeHandler，
  • 上传下载文件rz,sz命令 bitcarter linux命令rz
    刚开始使用rz上传和sz下载命令： 因为我们是通过secureCRT终端工具进行使用的所以会有上传下载这样的需求： 我遇到的问题： sz下载A文件10M左右，没有问题 但是将这个文件A再传到另一天服务器上时就出现传不上去，甚至出现乱码，死掉现象，具体问题 解决方法： 上传命令改为;rz -ybe 下载命令改为：sz -be filename 如果还是有问题： 那就是文
  • 通过ngx-lua来统计nginx上的虚拟主机性能数据 ronin47 ngx-lua　统计 解禁ip
    介绍 以前我们为nginx做统计,都是通过对日志的分析来完成.比较麻烦,现在基于ngx_lua插件,开发了实时统计站点状态的脚本,解放生产力.项目主页: https://github.com/skyeydemon/ngx-lua-stats 功能 支持分不同虚拟主机统计, 同一个虚拟主机下可以分不同的location统计. 可以统计与query-times request-time
  • java-68-把数组排成最小的数。一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的。例如输入数组{32, 321}，则输出32132 bylijinnan java
    import java.util.Arrays; import java.util.Comparator; public class MinNumFromIntArray { /** * Q68输入一个正整数数组，将它们连接起来排成一个数，输出能排出的所有数字中最小的一个。 * 例如输入数组{32, 321}，则输出这两个能排成的最小数字32132。请给出解决问题
  • Oracle基本操作 ccii Oracle SQL总结Oracle SQL语法Oracle基本操作Oracle SQL
    一、表操作 1. 常用数据类型 NUMBER(p,s)：可变长度的数字。p表示整数加小数的最大位数，s为最大小数位数。支持最大精度为38位 NVARCHAR2(size)：变长字符串，最大长度为4000字节（以字符数为单位） VARCHAR2(size)：变长字符串，最大长度为4000字节（以字节数为单位） CHAR(size)：定长字符串，最大长度为2000字节，最小为1字节，默认
  • [强人工智能]实现强人工智能的路线图 comsci 人工智能
        1：创建一个用于记录拓扑网络连接的矩阵数据表      2:自动构造或者人工复制一个包含10万个连接(1000*1000)的流程图      3：将这个流程图导入到矩阵数据表中      4：在矩阵的每个有意义的节点中嵌入一段简单的
  • 给Tomcat，Apache配置gzip压缩(HTTP压缩)功能 cwqcwqmax9 apache
    背景： HTTP 压缩可以大大提高浏览网站的速度，它的原理是，在客户端请求网页后，从服务器端将网页文件压缩，再下载到客户端，由客户端的浏览器负责解压缩并浏览。相对于普通的浏览过程HTML ,CSS,Javascript , Text ，它可以节省40%左右的流量。更为重要的是，它可以对动态生成的，包括CGI、PHP , JSP , ASP , Servlet,SHTML等输出的网页也能进行压缩，
  • SpringMVC and Struts2 dashuaifu struts2springMVC
    SpringMVC VS Struts2 1: spring3开发效率高于struts 2: spring3 mvc可以认为已经100%零配置 3: struts2是类级别的拦截， 一个类对应一个request上下文， springmvc是方法级别的拦截，一个方法对应一个request上下文，而方法同时又跟一个url对应 所以说从架构本身上 spring3 mvc就容易实现r
  • windows常用命令行命令 dcj3sjt126com windowscmdcommand
    在windows系统中，点击开始－运行，可以直接输入命令行，快速打开一些原本需要多次点击图标才能打开的界面，如常用的输入cmd打开dos命令行，输入taskmgr打开任务管理器。此处列出了网上搜集到的一些常用命令。winver 检查windows版本 wmimgmt.msc 打开windows管理体系结构(wmi) wupdmgr windows更新程序 wscrip
  • 再看知名应用背后的第三方开源项目 dcj3sjt126com ios
    知名应用程序的设计和技术一直都是开发者需要学习的，同样这些应用所使用的开源框架也是不可忽视的一部分。此前《 iOS第三方开源库的吐槽和备忘》中作者ibireme列举了国内多款知名应用所使用的开源框架，并对其中一些框架进行了分析，同样国外开发者 @iOSCowboy也在博客中给我们列出了国外多款知名应用使用的开源框架。另外txx's blog中详细介绍了 Facebook Paper使用的第三
  • Objective-c单例模式的正确写法 jsntghf 单例iosiPhone
    一般情况下，可能我们写的单例模式是这样的： #import <Foundation/Foundation.h> @interface Downloader : NSObject + (instancetype)sharedDownloader; @end #import "Downloader.h" @implementation
  • jquery easyui datagrid 加载成功，选中某一行 hae jqueryeasyuidatagrid数据加载
    1.首先你需要设置datagrid的onLoadSuccess $( '#dg' ).datagrid({onLoadSuccess :  function (data){      $( '#dg' ).datagrid( 'selectRow' ,3); }});   2.onL
  • jQuery用户数字打分评价效果 ini JavaScripthtmljqueryWebcss
    效果体验：http://hovertree.com/texiao/jquery/5.htmHTML文件代码： <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery用户数字打分评分代码 - HoverTree</
  • mybatis的paramType kerryg DAOsql
    MyBatis传多个参数： 1、采用#{0},#{1}获得参数：    Dao层函数方法：     public User selectUser(String name,String area); 对应的Mapper.xml    <select id="selectUser" result
  • centos 7安装mysql5.5 MrLee23 centos
    首先centos7 已经不支持mysql，因为收费了你懂得，所以内部集成了mariadb，而安装mysql的话会和mariadb的文件冲突，所以需要先卸载掉mariadb，以下为卸载mariadb，安装mysql的步骤。   #列出所有被安装的rpm package rpm -qa | grep mariadb   #卸载 rpm -e mariadb-libs-5.
  • 利用thrift来实现消息群发 qifeifei thrift
               Thrift项目一般用来做内部项目接偶用的，还有能跨不同语言的功能，非常方便，一般前端系统和后台server线上都是3个节点，然后前端通过获取client来访问后台server，那么如果是多太server，就是有一个负载均衡的方法，然后最后访问其中一个节点。那么换个思路，能不能发送给所有节点的server呢，如果能就
  • 实现一个sizeof获取Java对象大小 teasp javaHotSpot内存对象大小sizeof
       由于Java的设计者不想让程序员管理和了解内存的使用，我们想要知道一个对象在内存中的大小变得比较困难了。本文提供了可以获取对象的大小的方法，但是由于各个虚拟机在内存使用上可能存在不同，因此该方法不能在各虚拟机上都适用，而是仅在hotspot 32位虚拟机上，或者其它内存管理方式与hotspot 32位虚拟机相同的虚拟机上 适用。     
  • SVN错误及处理 xiangqian0505 SVN提交文件时服务器强行关闭
    在SVN服务控制台打开资源库“SVN无法读取current” ---摘自网络 写道 SVN无法读取current修复方法 Can't read file : End of file found 文件：repository/db/txn_current、repository/db/current   其中current记录当前最新版本号，txn_current记录版本库中版本
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他