目录
一、网页的相关概念
浏览器内核
Web标准
HTML的基础骨架
HTML标签分类
单标签
双标签
HTML标签关系
HTML开发工具
二:HTML标签
HTML标签的语义化
为什么要有语义化标签
排版标签
标题标签
段落标签
水平线标签
换行标签
div和span标签
pre标签
文本格式化标签
标签属性
HTML实体
编辑 图像标签
标记属性
超链接标签
锚点定位
功能链接
注释标签
列表标签
无序列表 ul (unordered list)
有序列表 ol (ordered list)
自定义列表
语义化容器元素
元素包含关系
iframe标签
其他标签介绍
time (提供给浏览器或搜索引擎阅读的时间)
q (一小段引用文本); blockquote (大段引用的文本)
表格标签
表格的基本语法:
表头单元格
表格属性
合并单元格
表单标签
表单域
input元素(输入框)
button元素(按钮元素)
label元素 (普通元素,通常配合单选和多选框使用)
select元素 (下拉列表选择框)
textarea元素(文本域,多行文本框)
datalist元素(数据列表)
fieldset元素 (用于表单分组使用)
表格标签总结:
一、网页的相关概念
浏览器内核
负责读取网页内容,整理讯息,计算网页的显示方式并显示网页
查看浏览器市场份额:http://tongji.baidu.com/data/browaer
浏览器
内核
备注
IE
Trident
IE、猎豹安全、360极速浏览器、百度浏览器
firefox
Gecko
火狐浏览器内核
Safari
Webkit
苹果浏览器内核
chrome、Opera
Blink
chrome、Opera浏览器内核。Blink其实是WebKit的分支。
*android手机使用Webkit内核(二次开发)
ios手机使用自家Webkit
wp7(window系统的手机)使用IE浏览器Trident内核。
Web标准
由W3C组织(万维网联盟)和其他标准化组织制定的一系列标准的集合
构成:主要包括结构(Struture)、表现(Presentation)和行为(Behavior)三个方面
结构:用于对网页元素进行整理和分类 >>HTML
表现:用于设置网页元素的版式,颜色,大小等外观样式 >>CSS
行为:网页模型的定义及交互的编写 >>Javascript
二、HTML入门HTML(英文 Hyper Text-Markup Language的缩写)中文译为“超文本标签(标记)语言”,主要是通过HTML标签对网页中的文本、图片、声音等内容进行描述。
作用:网页由网页元素组成,这些元素利用HTML标签描述出来,通过浏览器解析,显示给用户
超文本:
1.可以加入图片、声音、动画、多媒体等内容(超越文本限制)
2.可以从一个文件跳转到另一个文件,与世界各地主机的文本连接(超级链接文本)例:
HTML的基础骨架
HTML骨架标签总结
标签名
定义
说明
HTML标签
页面中最大的标签,我们称为根标签
文档的头部
注意在head标签中我们必须要设置的标签是title
文档的标题
让页面拥有一个属于自己的网页标题
文档的主体
元素包含文档的所有内容,页面内容基本是放到body里面的,p,h,a,b,u,i,,s,em,del,ins,strong,img等
例如:vscode编译器!+回车快速生成html骨架
Document
文档声明,告诉浏览器,当前文档使用的是html标准是HTML5。不写声明文档,将导致浏览器进入怪异渲染模式。
lang属性:language,全局属性,表示该元素内部使用的文字是哪一种自然语言书写而成的。
en:英文 zh-CN:中文 fr:法文
文档的元数据:附加信息;charset:指定网页内容编码。
HTML骨架的快速生成(vscode)
1.html:5 然后按下Tab键即可生成HTML骨架
2.! 然后按下Tab键即可生成HTML骨架
HTML标签分类
在HTML标签中,带有“<>"符号的元素被成为HTML标签,如上面提到的、
、都是HTML标签,所谓标签就是放在“<>”标签符中表示某个功能的编码命令,也称为
HTML标签 或者
HTML元素 。
单标签
<标签名/>
单标签也称空标签,是指用一个标签符号即可完成的描述某个功能,例
双标签
<标签名>内容 标签名>
该语法中 “<标签名>” 表示该标签的开始,一般称为 “开始标签(start tag)”,“标签名>” 表示该标签的作用结束,一般称为 “结束标签(end tag)”。和开始标签相比,结束标签只是在前面加了一个关闭符 “/” 。 比如: 我是body
总结
元素(标签,标记)=起始标记(begin tag)+结束标记(end tag)+元素内容+元素属性
属性=属性名+属性值
属性的分类:1.局部属性:某些元素的特有的属性
2.全局属性:所有属性通用
HTML标签关系
HTML标签的相互关系就分为两种:
嵌套关系(父子关系)
title>
head>
并列关系(兄弟关系)
head>
body>
总结
如果两个标签之前的关系是嵌套关系,子元素最好缩进一个tab键的身位。
如果是并列关系,最好上下对齐。
HTML开发工具
市面上前端普遍的开发工具有以下几种
Dreamweaver、sublime、Webstrom、HBuilder、Visual Studio Code(微软发布[免费/开源/跨平台]的现代化代码编辑器)
推荐大家去使用Vscode的,一个字牛,不仅运行代码速度快,插件多,而且我最喜欢的是因为它的轻量级。第二个推荐的就是Webstorm了,功能齐全,唯一不舒服的就是比不上Vscode的速度,代码运行起来有些臃肿,不过也算极好的了,当然写代码最重要的不是工具的好坏,找到适合你的工具才是最好的。 ———————————————— 版权声明:本文为CSDN博主「亦世凡华、」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。 原文链接:https://blog.csdn.net/qq_53123067/article/details/125560732
二:HTML标签
HTML标签有很多,这里我们学习最为常用的,后面有些较少用的,我们可以去 MDN 查下手册就可以了。
HTML标签的语义化
所谓标签语义化,就是指标签的含义
1.每一个HTML元素都有具体的含义
a元素:超链接 、p元素:段落、 h1元素:一级标题
2.所有元素与展示效果无关
元素展示到页面的效果应该有css决定,因为浏览器带有默认的css样式
为什么要有语义化标签
1. 方便代码阅读和维护。
2. 同时让浏览器或者网络爬虫可以很好的解析,从而更好分析其中的内容。
3. 使用语义化标签会具有更好的搜索引擎优化。
核心:合适的地方给一个最为合适的标签。
语义是否良好:当我们去掉CSS之后,网页结构依然井然有序,并且有良好的可读性。
遵循的原则:先确定语义的HTML,再选择合适的CSS
排版标签
排版标签主要和CSS搭配使用,显示网页结构的标签,是网页布局最常用的标签
标题标签
单词缩写:h ead 头部,标题
为了使网页更具有语义化,我们经常会在页面中用到标题标签,HTML提供了6个等级的标题,即
、、、、和,没有等后面的标题
Document
我是一级标题
我是二级标题
我是三级标题
我是四级标题
我是五级标题
我是六级标题
注意:h1标签因为重要,尽量少用,一般h1都是给logo使用
段落标签
单词缩写:p aragraph 段落
在网页中要把文字有条理地显示出来,离不开段落标签,就如同我们平常写文章一样,整个网页也可以分为若干个段落,而段落的标签就是
我是段落
p元素是HTML文档中最常见的标签,默认情况下,文本在一个段落中会根据浏览器窗口的大下自动换行。
我是段落1
我是段落2
水平线标签
单词缩写:h or izontal 横线
在网页中常常看到一些水平线将段落与段落之间分开,使得文档结构清晰,层次分明。这些水平线可以通过插入图片后实现,也可以简单的通过标记来完成,
就是创建横跨网页水平线的标记其基本格式如下:
也是单标签
我是段落1
我是段落2
换行标签
单词缩写:br eak 打断,换行
在HTML中,一个段落中的文字会从左到右依次排列,直到浏览器窗口的右端,然后自动换行,如果希望某段文本强制换行显示,就需要使用换行标签。
我是段落1
内容1 内容2 内容3
内容1
内容2
内容3
div和span标签
div和span两个标签是没有语义的,是我们网页布局主要的两个盒子
div就是 div ision的缩写, 分割,分区的意思 其实有很多用div来组合的网页
span 跨度,跨距,范围
语法格式如下:
我是div
我是span
pre标签
预格式化文本元素
空白折叠 :在源代码中的连续空白字符(空格、换行、制表),在页面显示时,会被折叠为一个空格,而pre标签例外 ,在pre元素中的内容不会出现空白折叠pre元素内容出现的内容,会按照源代码格式显示到页面上。该元素通常用于在网页中显示一些代码 ,pre元素功能的本质 :它有一个默认的css属性。显示代码时,通常外面套code元素,code元素表示代码区域 。
var i = 2;
if(i){
console.log(i);
}
var i = 2;
if(i){
console.log(i);
}
文本格式化标签
在网页中,有时需要问文字设置粗体、斜体和下划线效果,这时就需要用到HTML中的文本格式化标签,是文字以特殊的方法显现。
标签
显示效果
和
文字以粗体的方式显示(html推荐使用strong)
和
文字以斜体的方式显示(html推荐使用em)
和
文字以加删除线的方式显示(html推荐使用del)
和
文字以加下划线的方式显示(html不赞成使用u)
总结:
、、、 只有使用没有强调的意思,正印证了我们上文讲到的写有语义化的标签更加合适、、l、 语义更强烈。
标签属性
使用HTML制作网页时,如果想让HTML标签提供更多的信息,可以使用HTML标签属性加以设置其基本语法格式如下:
<标签名 属性1='属性值1' 属性2='属性值2' ...> 内容 标签名>
例如
在上面的语法中
1.标签可以拥有多个属性,必须写在开始标签中,位于标签名的后面
2.属性之间不分先后顺序,标签名与属性、属性与属性之间均以空格分开
3.任何标签的属性都有默认值,省略该属性则取默认值
采取 键值对 的格式 key = "value"的格式
HTML实体
实体字符 (HTML Entity) 通常用于在页面中显示一些特殊字符。书写格式有两种,如下:
小于符号:<
大于符号:>
空格符号: 
版权符号:©
&符号:&
图像标签
单词缩写:im ag e 图像
HTML网页中任何元素的实现都要依靠HTML标签,要想在网页中显示图像,就需要使用图像标签接下来将详细介绍图像标签 以及和它相关的属性,其基本格式如下:
该语法中src属性用于指定图像文件的路径和文件名,它是img标签的必需属性:
标记属性
属性
属性值
描述
src
URL
图像的路径
alt
文本
图像不能显示时的替换文本
title
文本
鼠标悬停时显示的内容
width
像素(XHTML不支持%页面百分比)
设置图像的宽度
height
像素(XHTML不支持%页面百分比)
设置图像的高度
border
数字
设置图像边框的宽度
标签书写路径的写法
书写路径分为两种:绝对路径 和相对路径
站外资源 (非当前网站的资源) :书写 绝对路径
站内资源 (当前网站的资源) : 书写 相对路径(或绝对路径)
绝对路径的书写格式:
协议名://主机名:端口号/路径 (schema://host:port/path)
协议名:http、https、file
主机名:域名、IP地址
端口号:协议是http,默认端口号80;协议是https,默认端口号443
相对路径的书写格式:
以./开头,./表示当前资源所在的目录;可以书写../表示返回上一级目录;相对路径:./可以省略.
下一级路径 /
上一级路径 ../
超链接标签
单词缩写:a nchor 的缩写,基本解释为:锚,铁锚的。
在HTML中创建超链接非常简单,只需要标签环绕需要被链接的对象即可,其基本语法格式如下:
文本或图像
href (H ypertext Ref erence的缩写,意思是超文本引用):
用于指定链接目标的url地址,当为标签应用href属性时,它就具有了超链接功能。 target:
用于指定链接页面的打开方式其取值有 _self 和 _blank 两种,其中 _self 为默认值,_blank为在新窗口中的打开方式
这里提一下一个问题,根据上文我们要想点开链接是从新窗口打开的,需要给 a 标签的 target 赋值为 _black,可是在我们日常项目开发中,可能一个网站都要有成百上千的 a 标签,要想每一个都以新窗口打开是不是太费事了?针对这个问题,我在这里讲一下 base 标签的用法。
base标签:可以整体设置链接的打开状态
Document
如果又想设置有的标签是当前窗口打开,只需在相应的 a 标签设置 target = "_self" 即可。
注意:
1. 外部链接 需要添加 https://www. ...
2. 内部链接 直接链接内部页面即可,比如 首页
3. 如果当时没有确定链接目标时,通常将链接标签的href属性值定义为 "#"(即href='#'),表示该链接暂时为一个空链接。
4. 不仅可以创建文本超链接,在网页中各种网页元素,如图像、表格、音频、视频等都可以添加超链接。
锚点定位
通过创建锚点链接,用户能快速定位到目标内容。创建锚点链接分为两步:
1. 使用 “a href="#id名" 创建链接文本 (id属性:全局属性,表示元素在文档中的唯一编号)
2. 使用相应的id名标注跳转目标的位置
个人生活
人生经历
我的人生经历
个人生活
我的个人生活
锚点定位一般用于网页文章含有大量内容时,方便用户查找自己想要了解的内容而提供的快捷锚点以上代码虽然格式如此,但内容太少看不到效果,vscode可以生成乱文用作测试,lorem*100 Tab或者 回车键 来看一看。
功能链接
点击后,触发某个功能(只做了解即可)
1. 执行JS代码,javascript:
弹出:你好!
2. 发送邮件,mailto: (不过需要要求用户计算机上安装有邮件发送软件:exchange )
点击给我发送邮件
3. 拨号 tel: (不过需要要求用户计算机上安装有拨号软件,或使用的是移动端访问 )
点击给我拨打电话
注释标签
HTML中还有一种特殊的标签——注释标签。如果需要在HTML文档中添加一些便于阅读和理解但又不需要显示在页面中的注释文字,就需要使用注释标签,其基本格式如下:
注释内容不会显示在浏览器窗口中,但是作为HTML文档内容的一部分,也会被下载到用户的计算机上,查看源代码时就可以看到
列表标签
什么是列表?把....制成表,以表显示
容器里面装载着文字或图表的一种形式,叫列表。列表最大的特点就是 整齐、整洁、有序。
无序列表 ul (u nordered l ist)
无序列表的各个列表项之间没有顺序级别之分,是并列的。无序列表常用于制作菜单 或 新闻列表。其基本语法格式如下:
xxx美女择偶条件:
注意:
1.
中只能嵌套 ,直接在标签中输入其他标签或者文字的做法是不被允许的。
2.
与 之间相当于一个容器,可以容纳所有元素。
3. 无序列表会带有自己的样式属性,放下那个样式,一会让CSS来!
标签
去掉前面的项目符号(小圆点)
语法:
list-style : one;
有序列表 ol (o rdered l ist)
有序列表即为有排列顺序的列表,其各个列表项按照一定的顺序排列定义,有序列表的基本语法格式如下:
把大象放进冰箱,总共分几步?
打开冰箱门
把大象放进去
把冰箱门关上
自定义列表
定义列表常用于对术语和名词进行解释和描述,定义列表的列表项前没有任何项目符号,其基本语法如下:
名词1
名词1解释1
名词1解释2
示例:
关注我们
新浪微博
官方微信
联系我们
注意:
1.
dl>里面只能包含 dt>和 dd>
2.
dt>和 dd>个数没有限制,经常是一个 dt>对应多个 dd>
语义化容器元素
容器元素:该元素代表一个块区域,内部用于放置其他元素,之前的文章有提到 div 和 span 标签这两者虽然是容器元素但没有语义,现在在学习其它容器元素但是含有语义:
article : 通常用于表示整篇文章
header : 通常用于表示页头(表示文章的头部)
aside : 通常用于表示侧边栏(附加信息)
section : 通常用于表示文章的章节
footer: 通常表示页脚(表示文章的尾部)
元素包含关系
以前:快级元素可以包含行级元素,行级元素不可以包含块级元素,a元素除外;现在元素的包含关系由元素的内容类别决定。
总结:
1. 容器元素中可以包含任何元素
2. a元素中几乎可以包含任何元素
3. 某些元素有固定的子元素(ul>li, ol>li, dl>dt+dd)
4. 标题元素和段落元素不能相互嵌套,并且不能包含容器元素
iframe标签
iframe (框架页) 可替换元素,通常用于在网页中嵌入另一个元素。显示的内容取决于元素的属性
Document
百度
斗鱼
淘宝
这就有点像target中_self和_black一样,不过我们设置的iframe是让当前链接在我们设置的窗口打开,而不是当前页面打开。窗口可以自己设置,需要借用CSS样式 (后期也会单独讲)
其他标签介绍
abbr (缩写词)
CSS 是用于为页面添加样式
time (提供给浏览器或搜索引擎阅读的时间)
今年7月 我学习了HTML
q (一小段引用文本); blockquote (大段引用的文本)
最近热播的美剧《权力的游戏》中有一句非常经典的台词:在权力的斗争中,非胜即死,没有中间状态。
Lorem, ipsum dolor sit amet consectetur adipisicing elit. Temporibus expedita, nemo itaque tempore maxime magni
sit autem velit mollitia molestias aspernatur ducimus neque sunt id similique, labore eveniet nostrum
accusantium.
link 链接外部资源(CSS,图标)
Document
rel属性:relation,链接的资源和当前网页的关系;
type属性:链接资源的MIME类型
表格标签
表格主要用于显示、展示数据 ,因为它可以让数据显示的非常的规整,可读性非常好。特别是后台展示数据的时候,能够熟运用表格就显得很重要,一个清爽简约的表格能够把繁琐的数据表现的很有条理。
表格的基本语法:
单元格内的文字 td>
...
tr>
...
table>
1.
table>是用于定义表格的标签
2.
tr>标签用于定义表格中的行,必须嵌套在 table>标签中,相当于表格的行
3.
td>用于定义表格中的单元格,必须嵌套在 tr>标签中,相当于一行中的每一格子
4.字母td指表格数据(table data) ,即数据单元格的内容
表头单元格
标签表示HTML表格的表头部分(table head)
第一行表头单元格内的文字 th>
...
tr>
单元格内的文字 td>
...
tr>
...
table>
表格属性
属性名
属性值
描述
align
left
规定表格相对周围元素的对齐方式
border
1或者“”
规定表格单元是否拥有边框,默认为“”表示没有边框
cellpadding
像素值
规定单元边缘与其内容之间的空白,默认1像素
cellspacing
像素值
规定单元格之间的空白,默认2像素
width
像素值或者百分比
规定表格的宽度
这些属性要写到表格标签table里面
可以将表格分割成表格头部和表格主体两大部分
总结:
1. thead>用于定义表格的头部。 thead>内部必须拥有 tr>标签,位于第一行
2. tbody>用于定义表格的主体,主要用于放数据本体。
3.以上标签都是放在
table>标签中
合并单元格
合并单元格方式
1.跨行合并:rowspan=“合并单元格的个数”
2.跨列合并:colspan=“合并单元格的个数”
写合并代码:
1.跨行:最上侧单元格,写合并代码
2.跨列:最左侧单元格,写合并代码
表单标签
表单元素有一系列元素,主要用于收集用户数据,接下来会一一列举常见的表单元素
一个完整的表单通常由表单域 、表单控件(表单元素) 、和提示信息 3个部分构成
表单域
是一个包含表单元素的区域
在HTML标签中, 标签用于定义表单域,以实现用户信息的手机和传递。
会把它范围内的表单元素信息提交给服务器
各种表单元素控件
from>
常用属性
属性
属性值
作用
action
url地址
用于指定接收并处理表单数据的服务器程序的地址
method
get/post
用于设置表单数据的提交方式,其取值为get或者post
name
名称
用于指定表单的名称,以区分同一个页面中的多个表单域
在英语单词中,input是输入的意思,而在表单元素中 标签用于手机用户信息
在 标签中,包含一个type 属性,根据不同的type 属性值,输入字段拥有很多中形式(可以是文本 ,字段 ,复选框 ,掩码后的文本控件 ,单选按钮 ,按钮 等)
其语法基本格式如下:
1. 标签为单标签
2.type属性设置不同的属性值用来指定不同的控件类型
type属性的属性值及其描述如下:
属性值
描述
button
定义可点击按钮(多数情况用于通过javascript启动脚本)
checkbox
定义复选框
file
定义输入字段和“浏览”按钮,供文件上传
hidden
定义隐藏的输入字段
image
定义图像形式的提交按钮
password
定义密码字段,该字段中的字符被掩码
radio
定义单选按钮
reset
定义重置按钮,重置按钮会清除表单中的所有数据
submit
定义提交按钮,提交按钮会把表单数据发送到服务器
text
定义单行的输入字段,用户可在其中输入文本,默认宽度为20个字符
radio单选按钮
name是表单元素名字,这里的性别单选按钮必须有相同的名字name,才可以实现多选1
例如:
性别: 男 女 人妖
form>
除type属性外, 标签还有其他很多属性,其常用属性如下:
属性
属性值
描述
name
由用户自定义
定义input元素的名称
value
由用户自定义
规定input元素的值
checked
checked
规定此input元素首次加载时应当被选中
maxlength
正整数
规定输入字段中的字符的最大长度
value:
value用于用户选中后提交给后台的信息,必须要加
总结:
1.name和value是每个表单元素都有的属性值 ,只要给后台人员使用
2.name表单元素的名字,要求单选按钮和复选框有相同的name值
3.checked元素:用户第一次加载页面时,单选框或者多选框默认选中的那个选项,例如:checked=“checked”或者checked=“true”或者单写一个checked
4.maxlength用于规定文本框最多输入文字(字母,字符)的数量
5.新增:file元素
type=“file” 文件域,上传文件使用的
type属性 :reset、submit、button,默认值submit
这是一个按钮
label元素 (普通元素,通常配合单选和多选框使用)
标签用于绑定一个表单元素,当点击标签内的文本时,浏览器的光标自动选择对应的表单元素上,用来增加用户体验。
显示关联 ——可以通过for属性,让label元素关联某一个表单元素,for属性书写表单元素id的值
核心:标签的for属性 应当与相关的id属性相同
语法:
男 label>
隐式关联 ——直接将 label 嵌套在单选或多选框外面
请选择性别:
男
女
select元素 (下拉列表选择框)
select元素通常要和option(表示下拉列表的选项)元素配合使用
语法:
选项1 option>
选项2 option>
选项3 option>
...
1.中至少包含一对
2.在中定义selected=“selected”时,当前项即位默认选中项
optgroup标签 :
通过 标签把相关的选项组合在一起,label 属性为选项组规定描述,所有主流浏览器都支持 label 属性
请选择你最喜欢的主播:
周杰伦
蔡依林
WEed
ini
th00
123d
multiple标签: 允许在下拉列表中进行多选
请输入你喜欢的主播:
冯提莫
蔡依林
WETed
infi
th000
123ddd
textarea元素(文本域,多行文本框)
请填写简介:
cols=“每行中的字符数” row=”显示的行数“ ,我们实际中用CSS来改变大小
datalist元素(数据列表)
该元素本身不会显示到页面上,通常用于和普通文本框配合使用, 标签规定了 元素可能的选项列表,用来在为 元素提供"自动完成"的特性。用户能看到一个下拉列表,里边的选项是预先定义好的,将作为用户的输入数据。
请输入你常用的浏览器:
谷歌浏览器
IE浏览器
欧鹏浏览器
苹果浏览器
火狐浏览器
fieldset元素 (用于表单分组使用)
通常我们开发的时候,比如登录框,我们会把账号信息和基本信息进行分组
设置表单状态
在日常生活中我们可能会遇到一些根本无法点击的按钮,这就涉及到表单的状态了
表格标签总结:
游戏:
阅读:
电影:
音乐:
其他:
性别:
男
女
你可能感兴趣的:(html,前端)
WebSocket的详解
小陆不会敲代码
网络 websocket 网络协议 网络 学习 笔记 node.js
文章目录前言一、WebSocket是什么?二、WebSocket使用示例前端部分(JavaScript)后端部分(Node.js示例)三、WebSocket心跳机制前端心跳示例后端心跳检测示例(Node.js)四、WebSocket常用事件:五、WebSocket使用场景五、总结前言WebSocket是一种网络通信协议,它提供了一个全双工的通信通道,允许服务器与客户端之间进行实时数据交换。与传统的
代码随想录---算法训练营---总结
感谢上Di_123
前端算法题 前端 javascript
这个是结营时期的刷题量,开营的时候不到一百道题。我总共参加了60天这个代码随想录的算法训练营,每天按照计划逐步进行算法训练,卡尔老师讲的很好,要是有不理解的,偶尔会给他提建议,提问题。祝愿代码随想录未来发展越来越好这个训练营,真的刷新了我对算法的认知。其实对于一个前端JavaScript开发工程师来说,对算法要求不是很高,平常的工作中,顶多就写写递归,写写深搜和广搜,其他的方法真的对于我来说很少接
全员DeepSeek时代,前端能做些什么?
二川bro
前端 智能AI 前端 deepseek
全员DeepSeek时代,前端能做些什么?前些天发现了一个巨牛的人工智能学习网站,通俗易懂,风趣幽默,可以分享一下给大家。点击跳转到网站。https://www.captainbed.cn/cccDeepSeek开发阶段测试阶段部署阶段智能代码生成设计稿转代码实时代码审查测试用例生成自动化问题定位构建优化建议性能预测模型一、DeepSeek带来的前端范式变革1.1传统前端开发痛点分析DeepSee
爬虫遇到一个标签有两个类名怎么办?
勇敢的牛马
爬虫 python xhtml pycharm selenium 测试工具 css
1.使用CSS选择器:BeautifulSoup的select方法支持使用CSS选择器来定位元素。对于具有多个类名的元素,可以将类名连接起来,并在每个类名前加上一个点(.),表示同时具有这些类的元素。frombs4importBeautifulSoup#假设html_content是包含目标HTML的字符串soup=BeautifulSoup(html_content,'lxml')divs=so
329.大学生HTML期末大作业 —【纪念鲁迅文化主题网页】 Web前端网页制作 html+css
一只小小的眠羊
大学生期末大作业 文化 前端 html 课程设计 javascript html5 css jquery
目录一、更多推荐二、网页简介三、网页文件四、网页效果五、代码展示1.html2.CSS六、总结1.简洁实用2.使用方便3.整体性好4.形象突出5.交互式强一、更多推荐欢迎来到我的CSDN主页!您的支持是我创作的动力!Web前端网页制作、网页完整代码、大学生期末大作业案例模板完整代码、技术交流等,有兴趣的联系我交流学习!更多优质博客文章、网页模板点击以下链接查阅:仙女网页设计-CSDN博客5000+
HTML-05NPM使用踩坑
坐吃山猪
前端 html 前端
2025-03-04-NPM使用踩坑本文讲述了一个苦逼程序员在使用NPM的时候突然来了一记nmplogin天雷,然后一番折腾之后,终究还是没有解决npm的问题,最终使用cnpm完美解决的故事。文章目录2025-03-04-NPM使用踩坑@[toc]1-参考网址2-思路整理3-学习要点4-对比学习1-什么是npm、cnpm两者之间的区别1-npm概述2-cnpm概述3-npm和cnpm的区别2-如何
js逆向——webpack扣法
sin_0119
javascript webpack 前端 爬虫
01webpack讲解webpack是个静态模块打包工具,目的是为了让前端工程师写的前端代码变成浏览器可以识别的代码,并且可以达到前端项目的模块化,也就是如何更高效地管理和维护项目中的每一个资源。但无疑是对js逆向造成了妨碍。但如果掌握了扣取webpack的一些技巧也是不难的。接下来,说一下我对扣取webpack代码的一些理解。1.1webpack组成一个最基本的webpack组成有两个部分:自执
DeepSeek:如何通过自然语言生成HTML文件与原型图?
阿三0404
ai 人工智能 html 机器学习 深度学习
在当今快节奏的开发与设计环境中,快速生成HTML文件或原型图是每个开发者与设计师的迫切需求。虽然DeepSeek无法直接生成图片,但它却能够通过自然语言生成流程图、原型图以及交互式页面,甚至可以直接输出HTML代码。本文将详细介绍如何与DeepSeek高效交流,生成你想要的HTML文件或原型图,并分享一些实用技巧。1.DeepSeek的核心功能与优势DeepSeek是一款基于自然语言处理(NLP)
zl-docx2html:将文档转换为网页的利器
石喜宏Melinda
zl-docx2html:将文档转换为网页的利器zl-docx2html项目地址:https://gitcode.com/gh_mirrors/zl/zl-docx2html在现代技术文档管理中,将文档转换为网页格式是一项常见需求。无论是为了方便在线阅读、版本控制,还是为了更好地集成到网站或内部系统中,文档的网页化处理都显得尤为重要。今天,我们将向您推荐一款强大的开源工具——zl-docx2htm
html5 iframe实现页面预览pdf
十年 lius
web前端 html5
一个可以把上传文件的绝对地址拿到的方法://建立一个可存取到该file的urlfunctiongetObjectURL(file){varurl=null;//下面函数执行的效果是一样的,只是需要针对不同的浏览器执行不同的js函数而已if(window.createObjectURL!=undefined){//basicurl=window.createObjectURL(file);}else
提升Web可访问性的10个关键实践
zsy_1991
前端 javascript html
在当今互联网时代,确保网站的可访问性(Accessibility)已经成为开发者和设计师的重要任务之一。Web可访问性不仅有助于残障用户更好地访问和使用网站,还能提升整体用户体验。本文将介绍10个关键的Web可访问性实践,帮助你构建更加友好和包容的网站。1.使用语义化的HTML标签语义化的HTML标签不仅有助于搜索引擎优化(SEO),还能提升屏幕阅读器等辅助技术的理解能力。以下是一些常用的语义化标
swagger-01-swagger介绍
褚师子书
swagger java spring boot restful
swagger1.学习目标:了解前后端分离了解Swagger的作用和概念在SpringBoot中集成Swagger1.1swagger由来前后端分离,当前流行的开发模式Vue+SpringBoot早先的后端时代:前端只用管理静态页面;后端将html用模板引擎JSP进行开发前后端分离式时代:后端:后端控制层,服务层,数据访问层【后端团队】前端:前端控制层,视图层【前端团队】mock后端数据json,
使用curl测试websocket服务是否能正常连入
tiguer
websocket python 网络协议
部分场景,前端连接不上websocket服务,需要从后台验证websocket服务是否能连入,判断防火墙是否开通,反向代理是否配置正确,可以使用curl测试服务器websocket服务是否正常。分行命令curl--include\--no-buffer\--header"Connection:Upgrade"\--header"Upgrade:websocket"\--header"Host:ex
springboot生成二维码在word文档,并下载到本地
尼古拉骚
springboot+IO流 java spring javascript
springboot生成二维码在word文档,并下载到本地分为两部分演示,第一部分简单的生成word文档并保存到本地;第二部分生成二维码在word文档,并保存到本地。第一部分首先引入word的依赖资源com.lowagieitext2.1.7com.lowagieitext-rtf2.1.7com.itextpdfitext-asian5.2.0创建Word,并且写入IO流中,前端获取文件流才能保
Python就业薪资怎么样?前景如何?
田野猫咪
Python 计算机 python 人工智能 数据挖掘
Python是一种全栈的开发语言,你如果能学好Python,前端,后端,测试,大数据分析,爬虫等这些工作你都能胜任。那么Python现在在国内的就业薪资高吗?Python就业薪资怎么样?前景如何?对于这些问题,下面小编整理相关内容为大家详情解析,一起来了解吧~如果你也对Python感兴趣,想通过学习Python转行、做副业或者提升工作效率,我也为大家整理了一份【最新全套Python学习资料】一定对
组件封装避坑指南:少写1000行重复代码的秘诀!
程序员小续
javascript 前端 reactjs 前端框架 excel vue
一、前端组件的分类前端组件可以按照功能、用途、通用性等不同维度进行分类,主要包括以下几类:1.按功能分类展示型组件(UI组件)只负责UI视图渲染,不涉及业务逻辑例如:按钮(Button)、输入框(Input)、表单(Form)、卡片(Card)等业务逻辑组件具有特定业务逻辑,通常和接口交互例如:用户列表(UserList)、订单管理(OrderTable)等功能组件(工具类组件)提供功能性封装,通
前端开发中如何使用ChatGPT辅助开发?
破碎的天堂鸟
学习教程 chatgpt
以下是前端开发中使用ChatGPT辅助开发的完整指南,涵盖核心应用场景、实践方法及注意事项:一、代码生成与优化基础代码生成HTML/CSS/JS框架搭建:通过自然语言描述需求(如"生成带导航栏的响应式页面"),ChatGPT可快速生成结构清晰的代码骨架。例如,输入“用Flexbox实现垂直水平居中布局”,可得到包含justify-content和align-items属性的代码[1][32]。组件
C++ 1099 性感素数 (乙级)
小青龙emmm
c++ 算法 开发语言
“性感素数”是指形如(p,p+6)这样的一对素数。之所以叫这个名字,是因为拉丁语管“六”叫“sex”(即英语的“性感”)。(原文摘自http://mathworld.wolfram.com/SexyPrimes.html)现给定一个整数,请你判断其是否为一个性感素数。输入格式:输入在一行中给出一个正整数N(≤108)。输出格式:若N是一个性感素数,则在一行中输出Yes,并在第二行输出与N配对的另一
控制台报错:Uncaught (in promise):XXXXX问题定位以及前端文件流excel文件下载方法
wh20141212
vue使用 前端
今天对接上传文件的接口时,明明接口是通的,也正常返回了文件流,然而,控制台就是打印不出返回值,而且一直报错Uncaught(inpromise):XXXXX去查看axios的封装函数,这个internalerror是从返回值拦截器的err中抛出来,这意味着这个axios的函数调用的过程中有异常,失败了。排查问题:1.先从拦截器返回值的判断开始排查,因为控制台无法输出数据查看是否将数据拦截错误,或者
电商商业平台技术架构系列教程之:电商平台概述与发展趋势
AI天才研究院
架构师必知必会系列 编程实践 大数据 人工智能 语言模型 Java Python 架构设计
作者:禅与计算机程序设计艺术文章目录1.简介2.电商平台概述2.1电商平台概念2.2电商平台定义2.3电商平台发展史2.3.1起源2.3.2发展阶段2.3.2.1B2C模式2.3.2.2C2B模式2.3.2.3混合模式2.3.2.4超级电商模式2.3.2.5智慧电商模式2.3.2.6小程序电商模式2.3.3目前发展现状3.电商平台关键技术3.1基础技术3.1.1网站前端3.1.2网站后台3.1.3
Webpack缓存优化策略探讨
创梦引领
webpack 缓存 前端 JavaScript
在前端开发中,Webpack是一个广泛使用的模块打包工具,它可以将多个前端资源(如JavaScript、CSS、图片等)打包成静态资源,以提高应用的加载速度和性能。然而,由于前端应用的不断迭代更新,缓存成为一个重要的优化方向。本文将探讨如何通过Webpack的缓存优化策略来提升应用的性能。一、文件指纹文件指纹是实现缓存策略的基础。通过给文件名添加唯一的标识符,可以实现在文件内容未变化时,仍然使用缓
Nginx解决前端跨域问题
m0_74823827
面试 学习路线 阿里巴巴 nginx 前端 运维
1.理解CORS和同源策略1.1同源策略同源策略是一种浏览器安全机制,用于阻止不同源(不同域名、协议或端口)的Web应用相互访问数据。它确保了Web应用的隔离性,防止恶意网站访问用户数据或执行不安全的操作。同源策略下,同一个域(相同的协议、域名和端口)内的资源可以自由访问。但如果协议、域名或端口有任何不同,浏览器会阻止这种访问。1.2跨域资源共享(CORS)CORS(Cross-OriginRes
HTML+CSS面试试题(部分)
四分十七
前端学习html html css 大数据
目录1:主流浏览器的内核分别是什么?2:每个HTML文件开头都有,它的作用是什么3:div+css的布局较table布局有什么优点?4:img的alt属性与title属性有何异同5:strong标签与em标签的异同6:渐进增强和优雅降级之间的不同7:为什么利用多个域名来存储网站资源8:网页标准和标准制定机构的意义9:简述一下src与href的区别10:网页制作会用的图片格式有哪些11:微格式,前端
从 React 看前端 UI 代码范式革命
哔哩哔哩技术
前端 react.js ui
前言本来打算写的主题是“我为什么讨厌ReactHooksAPI“,展开聊聊“小甜甜”是如何变成“牛夫人”的,没想到越写越严肃:)React是两次前端范式革命的引领者,至今仍有繁荣的社区和旺盛的创造力;React多次天才又激进的创新,一些想法被借鉴改良、一些引发广泛质疑,大部分是被认同和接受的;可以说React以一个框架之力,推动了整个前端领域的发展。范式是一种公认的模型或模式。本文从React出发
uniapp微信小程序canvas隐藏
Ann_R
uni-app 微信小程序 小程序
亲测好用~HTML我是把canvas嵌套在view里并被view设置idCSS把它给顶出去#canvas{position:fixed;top:-9999999999999rpx;}本文作者:小泽沐优声本文链接:https://www.cnblogs.com/ooo51o/p/12956678.html版权声明:本作品采用知识共享署名-非商业性使用-禁止演绎2.5中国大陆许可协议进行许可。
vue2前端使用图片展现视频,无法销毁请求
贾宝玉单臂擒方腊
前端 音视频
实现思路,使用canvas绘制图像,然后使用动画帧刷新页面exportdefault{props:{info:{type:Object,default:()=>({url:'',index:''}),},},data(){return{currentImage:null,isFullScreen:false,canvas:null,ctx:null,canvasStyle:{height:'100
【CTF比赛Web题目快速探测】
D-river
security web安全 安全
CTF比赛Web题目快速探测一、快速信息收集1.基础信息扫描2.工具自动化辅助二、快速漏洞探测1.高频漏洞靶向测试2.前端相关漏洞三、工具链组合利用1.BurpSuite自动化2.专用工具链3.编码/解码辅助四、常见CTFWeb题快速索引表五、速攻思维导图六、总结在CTF比赛中快速攻克Web题目的核心是“高效信息收集+靶向性漏洞探测”,需结合手动测试与工具链快速定位漏洞类型。以下是一套实战优化流程
使用PHP爬虫获取1688商品分类:实战案例指南
数据小爬虫@
php 爬虫 开发语言
在电商领域,商品分类信息是商家进行市场调研、选品分析和竞争情报收集的重要基础。1688作为国内领先的B2B电商平台,提供了丰富且详细的商品分类数据。通过PHP爬虫技术,我们可以高效地获取这些分类信息,为商业决策提供有力支持。一、为什么选择PHP爬虫?PHP是一种广泛使用的服务器端脚本语言,特别适合用于Web开发和网络爬虫。它具有强大的网络请求和HTML解析能力,能够轻松实现从网页中提取数据的功能。
rabbitmq 学习 之 mirror queue cluster 搭建(26)
xiaoliuliu2050
rabbitmq
官网:https://www.rabbitmq.com/ha.html高可用(镜像)队列默认情况下,queues存放在RabbitMQ集群的单个节点之上。exchanges和bindings恰恰相反,在集群中的所有节点中都有存档。queues可以配置镜像以此可以在多个节点中有备份。每个镜像队列包含一个master节点和一个或者多个slave节点。如果master节点由于某种原因失效,那么“资历最老
Vue 和 dhtmlx-gantt 实现图表构建动态多级甘特图效果 ,横坐标为动态刻度不是日期
Tan-玛卡巴卡
甘特图
注意事项:1、横坐标根据日期转换成时间刻度在(gantt.config.scales);2、获取时间刻度的最大值(findMaxRepairTime);3、甘特图多级列表需注意二级三级每个父子id需要唯一(convertData)安装依赖npminstalldhtmlx-gantt--save在当前页引入和配置dhtmlx-ganttimportganttfrom"dhtmlx-gantt";//
SQL的各种连接查询
xieke90
UNION ALL UNION 外连接 内连接 JOIN
一、内连接
概念:内连接就是使用比较运算符根据每个表共有的列的值匹配两个表中的行。
内连接(join 或者inner join )
SQL语法:
select * fron
java编程思想--复用类
百合不是茶
java 继承 代理 组合 final类
复用类看着标题都不知道是什么,再加上java编程思想翻译的比价难懂,所以知道现在才看这本软件界的奇书
一:组合语法:就是将对象的引用放到新类中即可
代码:
package com.wj.reuse;
/**
*
* @author Administrator 组
[开源与生态系统]国产CPU的生态系统
comsci
cpu
计算机要从娃娃抓起...而孩子最喜欢玩游戏....
要让国产CPU在国内市场形成自己的生态系统和产业链,国家和企业就不能够忘记游戏这个非常关键的环节....
投入一些资金和资源,人力和政策,让游
JVM内存区域划分Eden Space、Survivor Space、Tenured Gen,Perm Gen解释
商人shang
jvm内存
jvm区域总体分两类,heap区和非heap区。heap区又分:Eden Space(伊甸园)、Survivor Space(幸存者区)、Tenured Gen(老年代-养老区)。 非heap区又分:Code Cache(代码缓存区)、Perm Gen(永久代)、Jvm Stack(java虚拟机栈)、Local Method Statck(本地方法栈)。
HotSpot虚拟机GC算法采用分代收
页面上调用 QQ
oloz
qq
<A href="tencent://message/?uin=707321921&Site=有事Q我&Menu=yes">
<img style="border:0px;" src=http://wpa.qq.com/pa?p=1:707321921:1></a>
一些问题
文强chu
问题
1.eclipse 导出 doc 出现“The Javadoc command does not exist.” javadoc command 选择 jdk/bin/javadoc.exe 2.tomcate 配置 web 项目 .....
SQL:3.mysql * 必须得放前面 否则 select&nbs
生活没有安全感
小桔子
生活 孤独 安全感
圈子好小,身边朋友没几个,交心的更是少之又少。在深圳,除了男朋友,没几个亲密的人。不知不觉男朋友成了唯一的依靠,毫不夸张的说,业余生活的全部。现在感情好,也很幸福的。但是说不准难免人心会变嘛,不发生什么大家都乐融融,发生什么很难处理。我想说如果不幸被分手(无论原因如何),生活难免变化很大,在深圳,我没交心的朋友。明
php 基础语法
aichenglong
php 基本语法
1 .1 php变量必须以$开头
<?php
$a=” b”;
echo
?>
1 .2 php基本数据库类型 Integer float/double Boolean string
1 .3 复合数据类型 数组array和对象 object
1 .4 特殊数据类型 null 资源类型(resource) $co
mybatis tools 配置详解
AILIKES
mybatis
MyBatis Generator中文文档
MyBatis Generator中文文档地址:
http://generator.sturgeon.mopaas.com/
该中文文档由于尽可能和原文内容一致,所以有些地方如果不熟悉,看中文版的文档的也会有一定的障碍,所以本章根据该中文文档以及实际应用,使用通俗的语言来讲解详细的配置。
本文使用Markdown进行编辑,但是博客显示效
继承与多态的探讨
百合不是茶
JAVA面向对象 继承 对象
继承 extends 多态
继承是面向对象最经常使用的特征之一:继承语法是通过继承发、基类的域和方法 //继承就是从现有的类中生成一个新的类,这个新类拥有现有类的所有extends是使用继承的关键字:
在A类中定义属性和方法;
class A{
//定义属性
int age;
//定义方法
public void go
JS的undefined与null的实例
bijian1013
JavaScript JavaScript
<form name="theform" id="theform">
</form>
<script language="javascript">
var a
alert(typeof(b)); //这里提示undefined
if(theform.datas
TDD实践(一)
bijian1013
java 敏捷 TDD
一.TDD概述
TDD:测试驱动开发,它的基本思想就是在开发功能代码之前,先编写测试代码。也就是说在明确要开发某个功能后,首先思考如何对这个功能进行测试,并完成测试代码的编写,然后编写相关的代码满足这些测试用例。然后循环进行添加其他功能,直到完全部功能的开发。
[Maven学习笔记十]Maven Profile与资源文件过滤器
bit1129
maven
什么是Maven Profile
Maven Profile的含义是针对编译打包环境和编译打包目的配置定制,可以在不同的环境上选择相应的配置,例如DB信息,可以根据是为开发环境编译打包,还是为生产环境编译打包,动态的选择正确的DB配置信息
Profile的激活机制
1.Profile可以手工激活,比如在Intellij Idea的Maven Project视图中可以选择一个P
【Hive八】Hive用户自定义生成表函数(UDTF)
bit1129
hive
1. 什么是UDTF
UDTF,是User Defined Table-Generating Functions,一眼看上去,貌似是用户自定义生成表函数,这个生成表不应该理解为生成了一个HQL Table, 貌似更应该理解为生成了类似关系表的二维行数据集
2. 如何实现UDTF
继承org.apache.hadoop.hive.ql.udf.generic
tfs restful api 加auth 2.0认计
ronin47
目前思考如何给tfs的ngx-tfs api增加安全性。有如下两点:
一是基于客户端的ip设置。这个比较容易实现。
二是基于OAuth2.0认证,这个需要lua,实现起来相对于一来说,有些难度。
现在重点介绍第二种方法实现思路。
前言:我们使用Nginx的Lua中间件建立了OAuth2认证和授权层。如果你也有此打算,阅读下面的文档,实现自动化并获得收益。SeatGe
jdk环境变量配置
byalias
java jdk
进行java开发,首先要安装jdk,安装了jdk后还要进行环境变量配置:
1、下载jdk(http://java.sun.com/javase/downloads/index.jsp),我下载的版本是:jdk-7u79-windows-x64.exe
2、安装jdk-7u79-windows-x64.exe
3、配置环境变量:右击"计算机"-->&quo
《代码大全》表驱动法-Table Driven Approach-2
bylijinnan
java
package com.ljn.base;
import java.io.BufferedReader;
import java.io.FileInputStream;
import java.io.InputStreamReader;
import java.util.ArrayList;
import java.util.Collections;
import java.uti
SQL 数值四舍五入 小数点后保留2位
chicony
四舍五入
1.round() 函数是四舍五入用,第一个参数是我们要被操作的数据,第二个参数是设置我们四舍五入之后小数点后显示几位。
2.numeric 函数的2个参数,第一个表示数据长度,第二个参数表示小数点后位数。
例如:
select cast(round(12.5,2) as numeric(5,2))  
c++运算符重载
CrazyMizzz
C++
一、加+,减-,乘*,除/ 的运算符重载
Rational operator*(const Rational &x) const{
return Rational(x.a * this->a);
}
在这里只写乘法的,加减除的写法类似
二、<<输出,>>输入的运算符重载
&nb
hive DDL语法汇总
daizj
hive 修改列 DDL 修改表
hive DDL语法汇总
1、对表重命名
hive> ALTER TABLE table_name RENAME TO new_table_name;
2、修改表备注
hive> ALTER TABLE table_name SET TBLPROPERTIES ('comment' = new_comm
jbox使用说明
dcj3sjt126com
Web
参考网址:http://www.kudystudio.com/jbox/jbox-demo.html jBox v2.3 beta [
点击下载]
技术交流QQGroup:172543951 100521167
[2011-11-11] jBox v2.3 正式版
- [调整&修复] IE6下有iframe或页面有active、applet控件
UISegmentedControl 开发笔记
dcj3sjt126com
// typedef NS_ENUM(NSInteger, UISegmentedControlStyle) {
// UISegmentedControlStylePlain, // large plain
&
Slick生成表映射文件
ekian
scala
Scala添加SLICK进行数据库操作,需在sbt文件上添加slick-codegen包
"com.typesafe.slick" %% "slick-codegen" % slickVersion
因为我是连接SQL Server数据库,还需添加slick-extensions,jtds包
"com.typesa
ES-TEST
gengzg
test
package com.MarkNum;
import java.io.IOException;
import java.util.Date;
import java.util.HashMap;
import java.util.Map;
import javax.servlet.ServletException;
import javax.servlet.annotation
为何外键不再推荐使用
hugh.wang
mysql DB
表的关联,是一种逻辑关系,并不需要进行物理上的“硬关联”,而且你所期望的关联,其实只是其数据上存在一定的联系而已,而这种联系实际上是在设计之初就定义好的固有逻辑。
在业务代码中实现的时候,只要按照设计之初的这种固有关联逻辑来处理数据即可,并不需要在数据库层面进行“硬关联”,因为在数据库层面通过使用外键的方式进行“硬关联”,会带来很多额外的资源消耗来进行一致性和完整性校验,即使很多时候我们并不
领域驱动设计
julyflame
VO DAO 设计模式 DTO po
概念:
VO(View Object):视图对象,用于展示层,它的作用是把某个指定页面(或组件)的所有数据封装起来。
DTO(Data Transfer Object):数据传输对象,这个概念来源于J2EE的设计模式,原来的目的是为了EJB的分布式应用提供粗粒度的数据实体,以减少分布式调用的次数,从而提高分布式调用的性能和降低网络负载,但在这里,我泛指用于展示层与服务层之间的数据传输对
单例设计模式
hm4123660
java Singleton 单例设计模式 懒汉式 饿汉式
单例模式是一种常用的软件设计模式。在它的核心结构中只包含一个被称为单例类的特殊类。通过单例模式可以保证系统中一个类只有一个实例而且该实例易于外界访问,从而方便对实例个数的控制并节约系统源。如果希望在系统中某个类的对象只能存在一个,单例模式是最好的解决方案。
&nb
logback
zhb8015
log logback
一、logback的介绍
Logback是由log4j创始人设计的又一个开源日志组件。logback当前分成三个模块:logback-core,logback- classic和logback-access。logback-core是其它两个模块的基础模块。logback-classic是log4j的一个 改良版本。此外logback-class
整合Kafka到Spark Streaming——代码示例和挑战
Stark_Summer
spark storm zookeeper PARALLELISM processing
作者Michael G. Noll是瑞士的一位工程师和研究员,效力于Verisign,是Verisign实验室的大规模数据分析基础设施(基础Hadoop)的技术主管。本文,Michael详细的演示了如何将Kafka整合到Spark Streaming中。 期间, Michael还提到了将Kafka整合到 Spark Streaming中的一些现状,非常值得阅读,虽然有一些信息在Spark 1.2版
spring-master-slave-commondao
王新春
DAO spring dataSource slave master
互联网的web项目,都有个特点:请求的并发量高,其中请求最耗时的db操作,又是系统优化的重中之重。
为此,往往搭建 db的 一主多从库的 数据库架构。作为web的DAO层,要保证针对主库进行写操作,对多个从库进行读操作。当然在一些请求中,为了避免主从复制的延迟导致的数据不一致性,部分的读操作也要到主库上。(这种需求一般通过业务垂直分开,比如下单业务的代码所部署的机器,读去应该也要从主库读取数