Accumulated code snippets/Tips

★Error in operations on Object elements in jquery1.7.2

In jquery1.7.2, an error is returned when you use the $ selector to operate the object element: the code is as follows:

$(‘object‘).hide();

It will be okay if you use native JS:

document.getElementsByTagName(‘object‘)[0].style.display = ‘none‘;

 

★Turn off the font of the button

When making a simple close button, we often use the letter X. To make it look more like a cross, you can set the font:

font-family: “Microsoft JhengHei”,”microsoft yahei”,Monaco,Menlo,Consolas,”Courier New”,monospace;

 

★The value of this is determined when the function is running.

<button id="btn1">button1</button><button id="btn2">button2</button>var obj = {    init : function(){        $(‘#btn1‘).click(this.alert);    },    init2 : function(){        var _this = this;        $(‘#btn2‘).click(function(){            _this.alert();        });    },    alert : function(){        alert(this);    }}         obj.init();obj.init2();

 

★Use regular expressions to split the number by kilobytes

With no decimal point:

"15000000".split("").reverse().join("").replace(/(\d{3})/g, "$1,").split("").reverse().join("");

Decimal point:

‘123123211312.333123‘.replace(/(?=(?!^)(?:\d{3})+(?:\.|$))(\d{3}(\.\d+$)?)/g,‘,$1‘);

 

★The background is translucent and the content is not transparent.

<Div> <p> opacity </P> </div> Div {Background: rgba (0.2, 0,) None repeat scroll! Important;/* implement FF background transparency, text opacity */Background: #000; filter: alpha (opacity = 20);/* Implement IE background transparency */width: 500px; height: 500px; color: # f30; font-size: 32px; font-weight: bold;} Div P {position: relative;}/* Implement IE text opacity */

Firefox uses rgba color to solve the problem that the sub-tag is semi-transparent, but IE does not support it very well.

Therefore, we can set a location attribute for tags that do not want to be transparent and solve the problem.

 

★Trigger the keydown event for the DIV Element

The reason why the DIV element cannot trigger keydown is that the graph cannot be focused. The processing method is to add the attribute tabindex to the div. The value of tabindex is an integer, indicating the order in which the elements obtain focus when pressing the tab key. When the value is-1, you cannot obtain the focus by pressing tab, but you can use JS Code to focus and blur. At the same time, you can still trigger the keydown event.

To enable the DIV to trigger the keydown event, you only need the following code:

<div tabindex="-1">hello world !</div>

After this attribute is added, the DIV will display a highlighted outer box, and the value of outline: none can be solved.

 

★Query URL parameters

function getParameterByName(name) {    var match = RegExp(‘[?&]‘ + name + ‘=([^&]*)‘)                    .exec(window.location.search);    return match && decodeURIComponent(match[1].replace(/\+/g, ‘ ‘));}

 

★On the mobile terminal, the elements bound with the click event will show a highlighted box when you click. The following code can be removed:

-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color: transparent; /* For some Androids */