2020-08-17 html data-attribute + css non-replaceable element + JS multi-file upload component + soft skills third-party website to monitor whether the local user opens an application

2020-08-17 Source of topic: http://www.h-camel.com/index.html

[html] Give examples to illustrate the advantages of using data-?

data- is a new custom attribute provided by H5 for front-end development, which can be obtained through the object's dataset, and browsers that do not support this attribute can obtain it through the getAttribute method.

After data- is an attribute composed of multiple words separated by hyphens, use camel case style when obtaining.

Obtaining method: <li id="getId" data-id="122" data-vice-id="11">获取id</li>

1.getAttribute()

const getId = document.getElementById('getId');

getId.getAttribute("data-id");

getId.setAttribute("data-id","48");

2.jquery data() method

var id = $("#getId").data("id"); //122 取值

var viceId = $("#getId").data("vice-id"); //11 取值

$("#getId").data("id","100");//100 赋值

3.jquery attr() method

var id = $("#getId").attr("data-id"); //122 取值

var viceId = $("#getId").attr("data-vice-id"); //11 取值

$("#getId").attr("data-id","100");//100 赋值

[css] What is the performance of using width/height/margin/padding on non-replaceable elements

Most of the elements in HTML are non-replaceable elements, and the content is directly presented to the client, such as p span li ab strong and other elements. The widht height of non-replaced elements in the line will not work. The height can only be controlled by line-height, padding works on the left and right, and margin works on the left and right, from the "CSS Authoritative Guide"

Transfer from: https://blog.csdn.net/wulinbanxia/article/details/53029572

[js] Use js to write a multi-file upload component

bootstrap fileinput file upload component

Source code and API address:

Bootstrap-fileinput source code: https://github.com/kartik-v/bootstrap-fileinput

bootstrap-fileinput在线API:http://plugins.krajee.com/file-input

bootstrap-fileinput Demo Exhibit: http://plugins.krajee.com/file-basic-usage-demo

For actual usage examples, see here: https://www.cnblogs.com/landeanfen/p/5007400.html

[Soft skills] When a third-party website uses QQ to log in, how does QQ detect whether the user has a QQ login locally?

http://www.mamicode.com/info-detail-129037.html

Guess you like

Origin blog.csdn.net/vampire10086/article/details/108490100