网站前端

SVG、JavaScript、CSS、HTML、各种框架。Web前端开发是从美工演变而来的,名称上有很明显的时代特征。在互联网的演化进程中,Web 1.0时代,网站的主要内容都是静态的,用户使用网站的行为也以浏览为主。

各种各样的框架让人目不暇接,新技术层出不穷。让我们这些前端狗情何以堪。

目前web前端工程师的年薪待遇平均在10万以上,高级HTML前端工程师年薪达30—50万,很多企业对于与web前端相关的技术职位更是求贤若渴。

纯 Javascript 操作 DOM class

2021年09月29日

在页面上使用纯 Javascript 操作 class 属性,具体示例如下:增加 class 属性:var testarray = document.getElementsByClassName("currentclass"); for(var i = 0; i < testarray.length; i++) { testarray[i].className += " classt...

纯 Javascript 等效 JQuery $('document').ready(function(){});

2021年09月29日

最近使用纯 Javascript 编写代码,使用惯了 JQuery 反而不习惯使用纯 Javascript 编写代码。在 JQuery 中页面加载完成之后的代码一般如下:$('document').ready(function(){});在纯 Javascript 中如果要实现相同功能,具体代码如下:document.addEventListener("DOMContentLoaded", fun...

纯 Javascript $().bind('click',function(){}) 实现方法

2021年09月29日

最近由于没有引入 JQuery 只能使用纯 Javascript 实现点击事件监听。下面是使用纯 Javascript 实现点击事件监听代码:<a href="doc.html" id="some-id">click here</a>Javascript 代码:function myFunc(eventObj) { // ... } var myElement = document....

JS取整以及四舍五入

2021年09月29日

丢弃小数部分,保留整数部分parseInt(7/2) 向上取整,有小数就整数部分加1Math.ceil(7/2) 四舍五入Math.round(7/2) 向下取整Math.floor(7/2) 保留小数位数10.989.toFixed(2) // 10.99 10.984.toFixed(2) // 10.98

contentType 与 dataType 区别

2021年09月08日

最近在使用 Jquery 的 $.ajax() 向后端提交数据,具体代码片段如下:$.ajax({ type: "POST", url: "/api/v1/tools/ip-convert", contentType: 'application/json', dataType: "json", data: JSON.stringify({"ip": $IPVal}),...

Javascript 替换多个空格

2021年09月07日

Javascript 替换多个空格,具体示例代码如下:let cidr_selected = $("#tools-mdc-text-field").val();const r = /\s+/g;cidr_selected = cidr_selected.replace(r, '');这里获取用户输入,之后使用正则替换空格。

CSS Blockquote 样式

2021年07月30日

在使用Markdown的时候,有一些样式需要自己定义,Markdown Blockquote,下面是 Blockquote 自定义的样式:blockquote { background: #f9f9f9; border-left: 10px solid #ccc; margin: 1.5em 10px; padding: 0.5em 10px; quotes: "\2...

d3.js 缺失数据处理

2021年07月26日

最近在使用D3.js v3的时候遇到一些问题,有些数据会缺失,导致显示有问题,数据示例如下:上面是随机选取的一个示例,这里存在一些null数据,需要处理。处理空数据,需要使用到D3里面的defined方法:该d3.line.defined()方法,您可以指定是否有一个给定的数据点或没有定义的数据。如果此方法返回 false,则表示数据点存在,否则为 true。下面是代码示例:_line = d3....