html
关注
分享
扫一扫
文章平均质量分 53
王永存
大道至简
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
什么是web components？
什么是Web ComponentsWeb Components 是一套不同的技术，允许您创建可重用的定制元素（它们的功能封装在您的代码之外）并且在您的web应用中使用它们。背景组件：最初的目的是代码重用，功能相对单一或者独立。在整个系统的代码层次上位于最底层，被其他代码所依赖，所以说组件化是纵向分层。使用方法1. 创建一个类或函数来指定web组件的功能，推荐请使用 ECMAScript 2015 的类语法。2. 使用 CustomElementRegistry.define() 方法注册自己的新转载 2022-06-29 15:03:13 · 3829 阅读 · 0 评论 -
Mixed Content: The page at ‘xxx‘ was loaded over HTTPS, but requested an insecure resource ‘xxx‘.
HTTPS页面里动态的引入HTTP资源，比如引入一个js文件，会被直接block掉的.在HTTPS页面里通过AJAX的方式请求HTTP资源，也会被直接block掉的。Mixed Content: The page at 'xxx' was loaded over HTTPS, but requested an insecure resource 'xxx'. This request has been blocked; the content must be served over HTTPS.转载 2022-05-30 16:48:19 · 749 阅读 · 0 评论 -
input type=password 取消密码提示框
浏览器记住密码后，在写页面时，设置了input的type='input'时，会带出密码提示框让你回填（如下图所示），怎么才能取消它呢？百度了很多的办法，1、说加一个隐藏的input框（最佳办法）2、加属性 autocomplete=“new-password” 3、通过失去焦点，获取焦点来控制在谷歌浏览器的试的，没有一个能行的。没有办法，还是靠自己实现吧。大致思路是这样的，利用input的 readonly结合失焦/焦点/点击等事件进行处理，具体代码如下：<input ty...原创 2021-08-01 22:52:01 · 5306 阅读 · 5 评论 -
前端知识图谱
原创 2019-05-11 13:21:46 · 1651 阅读 · 0 评论 -
基于JQ的无缝滚动封装
公司最近项目无缝滚动效果比较多，趁闲的时候写了一个小的插件。方便实用，这里分享给大家。可以实现左右无缝滚动，上下无缝滚动，还可以调整滚动的速度，鼠标悬停功能。html代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title&am原创 2018-07-20 14:29:06 · 729 阅读 · 0 评论 -
input 标签的监听事件
1.onfocus 当input 获取到焦点时触发2.onblur 当input失去焦点时触发，注意：这个事件触发的前提是已经获取了焦点再失去焦点的时候会触发相应的js3.onchange 当input失去焦点并且它的value值发生变化时触发4.onkeydown 在 input中有键按住的时候执行一些代码5.onkeyup 在input中有键抬起的时候触发的事件，在此事件触发之前一定触发了...原创 2018-03-20 10:38:11 · 7872 阅读 · 0 评论 -
点击返回顶部(滑动效果)
点击返回顶部手机端和PC端很多需求需要做点击返回顶部，例如下图：当网页被卷上去的高度大于绿色方框的高度时，显示点击返回顶部的按钮，点击之后，返回当顶部。 代码：1、html代码（自己找一张点击返回顶部的图片） 2、CSS代码（用固定定位，其他样式根据要求自己调整） .back_top{ position:原创 2018-01-10 16:33:29 · 9850 阅读 · 0 评论 -
获取url地址中查询字符串的某一个
例如 url: www.baidu.com?id=123&member=789想要获取该url里的id的值，方法如下：function getSearchString(key) { // 获取URL中?之后的字符 var str = location.search; str = str.substring(1,str.length);原创 2018-01-05 12:47:10 · 2883 阅读 · 0 评论 -
div模拟textarea文本域轻松实现高度自适应
div模拟textarea文本域及高度自适应使用很简单，一个普通的block元素上加个contenteditable="true"就ok了，如下： true外面的引号甚至去掉都没关系。contenteditable属性虽是HTML5里面的内容，但是IE似乎老早就支持此标签属性了。所以，兼容性方面还是不用太担心的。ok，最麻烦的模拟textarea的可编辑转载 2017-12-07 10:40:22 · 611 阅读 · 0 评论 -
实现两个div，左边固定div宽度200px，右边div自适应
/*方法一： BFC(块级格式化上下文)*/ .container{ width:1000px;height:400px;border: 1px solid red; } .left{ width:200px;height:100%;background: gray; float: left;转载 2017-12-15 11:30:49 · 669 阅读 · 0 评论 -
网站的meta标签使用知识
Meta标签是网页最顶部出现的几段英文语句，那么Meta标签都有哪些呢？它们各自的属性又代表什么呢？下面就讲述一下，希望大家能了解一下： 1、meta标签 meta标签是html语言中，head区的一个辅助性标签。几乎所有的网页里，我们都可看到类似网页中meta标签的使用，关键字下面这段的html代码： ＜head＞ ＜meta http-equiv="content-转载 2017-10-11 11:33:16 · 1680 阅读 · 0 评论 -
html页面内容的收缩和展开效果
html页面内容的收缩和展开效果常见的网页中，会见到收缩和展开的效果。比如经常浏览网页里的新闻内容就会经常看到这种效果，新闻的内容只显示少数的一部分，然后后面会跟一个展开的链接，点击这个链接才会显示全部的新闻内容。1、收缩情况下显示内容效果2、点开之后显示的内容效果3、实现的代码如下：<!DOCTYPE html><html lang="e...原创 2020-02-08 12:16:46 · 36002 阅读 · 9 评论 -
html中form表单的使用方法和介绍
form表单的使用方法第1节、表单赏析第2节、了解表单功能：用于搜集不同类型的用户输入的内容 有了表单，网页的内容可以由用户自己创建，那么对于网页来说，我们既是网页创建都者，也是网页的消费者。第2节、常用的表单元素ü form 表单ü input 表单元素，表单项ü select和option 下拉菜单ü tex原创 2017-10-04 09:43:33 · 95137 阅读 · 14 评论 -
html web页面中table表格的使用方法和介绍
html中table表格的使用一、表格赏析 1、基金网：http://fund.eastmoney.com/dingtou/syph_yndt.html 2、NBA: http://china.nba.com/standings/ 3、12306：https://kyfw.12306.cn/otn/leftTicket/init二、创原创 2017-10-04 09:22:15 · 23347 阅读 · 0 评论 -
html web页面锚点的设置
html页面锚点的设置一、锚点是网页制作中超级链接的一种，又叫命名锚记。命名锚记像一个迅速定位器一样是一种页面内的超级链接，运用相当普遍。要想在页面中设置锚点就要用到a(anchor的缩写)标签了。二、超链接标签常见的属性： 1，href：用于链接到某个资源 2，target:表示目标，我们在打开一个页面时，是要新窗口打开还是在当前窗口打开，或是在框架中打开，就取决原创 2017-10-03 20:58:42 · 6101 阅读 · 0 评论 -
html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
*HTML5 现在已经不是SGML 的子集，主要是关于图像，位置，存储，多任务等功能的增加。*绘画canvas 用于媒介回放的video 和audio 元素 本地离线存储localStorage 长期存储数据，浏览器关闭后数据不丢失； sessionStorage 的数据在浏览器关闭后自动删除 语意化更好的内容元素，比如article、footer、heade原创 2017-10-08 19:22:48 · 3193 阅读 · 0 评论 -
oninput、onchange与onpropertychange事件的用法和区别
前端页面开发的很多情况下都需要实时监听文本框输入，比如腾讯微博编写140字的微博时输入框hu9i动态显示还可以输入的字数。过去一般都使用onchange/onkeyup/onkeypress/onkeydown实现，但是这存在着一些不好的用户体验。比如onchange事件只在键盘或者鼠标操作改变对象属性，且失去焦点时触发，脚本触发无效；而onkeydown/onkeypress/onkeyup在处转载 2017-09-16 17:01:56 · 415 阅读 · 0 评论