分类：原生JS

2020
10-13

原生js实现照片墙效果

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/><title>照片墙一多实例演示</title><styletype="text/css">body,div,h2,ul,li{margin:0;padding:0;}body{font:12px/1.5Arail;}.box{width:860px;margin:10pxauto;backgro... 继续阅读 >
2020
10-08

关于vue 结合原生js 解决echarts resize问题

关于vue 结合原生js 解决echarts resize问题 解决页面echarts图表resize问题左侧的菜单栏模块是可以收缩的，点击左上角的icon可以收缩，但是点击左上角的icon后，右侧的echarts图并未进行对应的收缩，使用element-resize-detector插件能够解决问题（如何解决Vue项目中使用echarts，宽度变化导致图不能resize问题）但是会有点卡顿，所以采用原生的方法来处理，再结合windows自带的原生resize事件处理浏览器宽度高度变化，可以不使用插件来处理问题了。<template><di... 继续阅读 >
2020
10-08

基于原生js实现判断元素是否有指定class名

【注意】以下方法只对class只有一个值的情况下操作结构部分：<div><p>1</p><pclass="test">2</p><p>3</p></div>js部分：varp=document.getElementsByTagName('p');for(vari=0;i<p.length;i++){//第一种方法，用classList这个H5API，有兼容性问题if(p[i].classList.contains('test')==true){console.log(p[i].innerHTML);}//第二种方法，用className这个属性if(p[i].className=='test'... 继续阅读 >
2020
09-29

原生JS实现汇率转换功能代码实例

代码如下html代码<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><metahttp-equiv="X-UA-Compatible"content="ie=edge"/><title>ExchangeRateCalculator</title><linkrel="stylesheet"href="style.css"rel="externalnofollow"/></head><body><imgsrc="money.png"alt=""class="money-img"/><h1>ExchangeRateCalcula... 继续阅读 >