अपनी परियोजनाओं में सीबीएस या सरलीकृत स्टाइलिंग और स्क्रिप्टिंग

प्रविष्टि

हाय खाबरोविते

मैं आपके ध्यान में एक छोटा लेकिन उपयोगी कार्य लाना चाहता हूं जो:

• मेकअप काम को थोड़ा आसान और साफ करता है।
• यह लोकप्रिय प्लेटफार्मों, अला jQuery के माध्यम से पृष्ठ पर तत्वों के चयन को सरल करेगा

फ़ंक्शन का अर्थ यह है कि, पृष्ठ को लोड करने के बाद / उसके बाद, महत्वपूर्ण ग्राहक मापदंडों को निर्धारित करने के लिए, जैसे:
ब्राउज़र, ब्राउज़र संस्करण, O.S., ब्राउज़र इंजन, आदि।
और उन्हें अपने पेज के html टैग में रखें।

ज्यादा है। क्या हम पढ़ रहे हैं?

इसकी आवश्यकता क्यों है?

व्यक्तिगत रूप से, मेरे लिए इस तरह के एक समारोह में मेरे लिए यह बहुत सुविधाजनक है, यह विभिन्न ब्राउज़रों, विशेष रूप से सबसे पुराने और शरारती लोगों के लिए शैलियों के लेखन को सरल बनाता है, और कुछ शर्तों के आधार पर पृष्ठ पर तत्वों का उपयोग करना भी आसान बनाता है। यह ब्राउज़र संस्करण या ओएस हो

चलो चलें?

स्वयं कार्य:
var CBS = function () {

var ua = navigator.userAgent.toLowerCase(); //
// -1
//
var is = function (t){
return ua.indexOf(t) > -1;
};

// -
var cookie = navigator.cookieEnabled ? 'iscookie' : 'nocookie' ;

//
var g = 'gecko' ; // FF

var w = 'webkit' ; // Chrome

var s = 'safari' ; // Safari

var h = document .getElementsByTagName( 'html' )[0];

var b = [(!(/opera|webtv/i.test(ua))&&/msie\s(\d)/.test(ua))?( 'ie ie' +RegExp.$1 + ( is ( 'trident' )&& is ( 'msie 7.0' ) ? ' compat' : '' )): is ( 'firefox/2' )?g+ ' ff2' : is ( 'firefox/3' )?g+ ' ff3' : is ( 'firefox/4' )?g+ ' ff5' : is ( 'firefox/5' )?g+ ' ff5' : is ( 'gecko/' )?g:/opera(\s|\/)(\d+)/.test(ua)? 'opera opera' +RegExp.$2: is ( 'konqueror' )? 'konqueror' : is ( 'chrome' )?w+ ' ' +s+ ' chrome' : is ( 'applewebkit/' )?w+ ' ' +s+(/version\/(\d+)/.test(ua)? ' ' +s+RegExp.$1: '' ): is ( 'mozilla/' )?g: '' , is ( 'j2me' )? 'mobile' : is ( 'iphone' )? 'iphone' : is ( 'ipod' )? 'ipod' : is ( 'mac' )? 'mac' : is ( 'darwin' )? 'mac' : is ( 'webtv' )? 'webtv' : is ( 'win' )? 'win' +( is ( 'windows nt 5.1' )? ' xp' :( is ( 'windows nt 5.1' )? ' vista' :( is ( 'windows nt 6.1' )? ' win7' : '' ))): is ( 'freebsd' )? 'freebsd' :( is ( 'x11' )|| is ( 'linux' ))? 'linux' : '' , 'js' ];

c = b.join( ' ' )+ ' ' +cookie;

h.className += ' ' + c;

return c;
};

* This source code was highlighted with Source Code Highlighter .


var CBS = function () {

var ua = navigator.userAgent.toLowerCase(); //
// -1
//
var is = function (t){
return ua.indexOf(t) > -1;
};

// -
var cookie = navigator.cookieEnabled ? 'iscookie' : 'nocookie' ;

//
var g = 'gecko' ; // FF

var w = 'webkit' ; // Chrome

var s = 'safari' ; // Safari

var h = document .getElementsByTagName( 'html' )[0];

var b = [(!(/opera|webtv/i.test(ua))&&/msie\s(\d)/.test(ua))?( 'ie ie' +RegExp.$1 + ( is ( 'trident' )&& is ( 'msie 7.0' ) ? ' compat' : '' )): is ( 'firefox/2' )?g+ ' ff2' : is ( 'firefox/3' )?g+ ' ff3' : is ( 'firefox/4' )?g+ ' ff5' : is ( 'firefox/5' )?g+ ' ff5' : is ( 'gecko/' )?g:/opera(\s|\/)(\d+)/.test(ua)? 'opera opera' +RegExp.$2: is ( 'konqueror' )? 'konqueror' : is ( 'chrome' )?w+ ' ' +s+ ' chrome' : is ( 'applewebkit/' )?w+ ' ' +s+(/version\/(\d+)/.test(ua)? ' ' +s+RegExp.$1: '' ): is ( 'mozilla/' )?g: '' , is ( 'j2me' )? 'mobile' : is ( 'iphone' )? 'iphone' : is ( 'ipod' )? 'ipod' : is ( 'mac' )? 'mac' : is ( 'darwin' )? 'mac' : is ( 'webtv' )? 'webtv' : is ( 'win' )? 'win' +( is ( 'windows nt 5.1' )? ' xp' :( is ( 'windows nt 5.1' )? ' vista' :( is ( 'windows nt 6.1' )? ' win7' : '' ))): is ( 'freebsd' )? 'freebsd' :( is ( 'x11' )|| is ( 'linux' ))? 'linux' : '' , 'js' ];

c = b.join( ' ' )+ ' ' +cookie;

h.className += ' ' + c;

return c;
};

* This source code was highlighted with Source Code Highlighter .


var CBS = function () {

var ua = navigator.userAgent.toLowerCase(); //
// -1
//
var is = function (t){
return ua.indexOf(t) > -1;
};

// -
var cookie = navigator.cookieEnabled ? 'iscookie' : 'nocookie' ;

//
var g = 'gecko' ; // FF

var w = 'webkit' ; // Chrome

var s = 'safari' ; // Safari

var h = document .getElementsByTagName( 'html' )[0];

var b = [(!(/opera|webtv/i.test(ua))&&/msie\s(\d)/.test(ua))?( 'ie ie' +RegExp.$1 + ( is ( 'trident' )&& is ( 'msie 7.0' ) ? ' compat' : '' )): is ( 'firefox/2' )?g+ ' ff2' : is ( 'firefox/3' )?g+ ' ff3' : is ( 'firefox/4' )?g+ ' ff5' : is ( 'firefox/5' )?g+ ' ff5' : is ( 'gecko/' )?g:/opera(\s|\/)(\d+)/.test(ua)? 'opera opera' +RegExp.$2: is ( 'konqueror' )? 'konqueror' : is ( 'chrome' )?w+ ' ' +s+ ' chrome' : is ( 'applewebkit/' )?w+ ' ' +s+(/version\/(\d+)/.test(ua)? ' ' +s+RegExp.$1: '' ): is ( 'mozilla/' )?g: '' , is ( 'j2me' )? 'mobile' : is ( 'iphone' )? 'iphone' : is ( 'ipod' )? 'ipod' : is ( 'mac' )? 'mac' : is ( 'darwin' )? 'mac' : is ( 'webtv' )? 'webtv' : is ( 'win' )? 'win' +( is ( 'windows nt 5.1' )? ' xp' :( is ( 'windows nt 5.1' )? ' vista' :( is ( 'windows nt 6.1' )? ' win7' : '' ))): is ( 'freebsd' )? 'freebsd' :( is ( 'x11' )|| is ( 'linux' ))? 'linux' : '' , 'js' ];

c = b.join( ' ' )+ ' ' +cookie;

h.className += ' ' + c;

return c;
};

* This source code was highlighted with Source Code Highlighter .


इसे स्क्रिप्ट टैग में डालें जो सिर के अंदर है
हम फ़ंक्शन को इसकी परिभाषा के बाद कहते हैं या जब पृष्ठ पूरी तरह से लोड होता है, तो मैं पहले विकल्प की सिफारिश करूंगा।
CBS();


वह सब मालूम होता है! आगे क्या है?

अपने स्रोत देखें!

एक उदाहरण (IE ब्राउज़र में लॉन्च किया गया फ़ंक्शन):
html class="ie ie7 win win7 js iscookie"


हम देखते हैं कि मैं IE ब्राउज़र के माध्यम से लॉग इन किया, संस्करण 7 (हालांकि मैं वास्तव में IE9 के माध्यम से लॉग इन किया था, लेकिन डेवलपर टूल में मैंने पुराने संस्करण का अनुकरण चुना)।
ओ.एस. - विंडोज, संस्करण - win7, iscookie - ब्राउज़र में कुकीज़ समर्थित हैं।

अब इसका क्या करें?

मान लीजिए कि आपको एक हानिकारक क्लाइंट के लिए शैलियों को लिखना है जिसके लिए IE6 / 7 समर्थन की आवश्यकता है, या आपको केवल ब्राउज़र के आधार पर एक अलग ब्लॉक प्रदर्शित करने की आवश्यकता है।

अब आप सशर्त टिप्पणियों का उपयोग करेंगे।
हम पहले से ही 1 अनुरोध सहेजते हैं

इसके बाद, आपको गंदे स्टाइल हैक का उपयोग नहीं करना होगा, जैसे:
height: 10px;
//height: 11px;
#height: 9px;


आप विभिन्न घटनाओं के लिए शैलियों को ओवरराइट / जोड़ते हैं:
.normal-class {
height: 20px; //
}

.ie7 .normal-class {
height: 30px; // Internet Exporer 7
}


सच है, क्या यह क्लीनर और अधिक सुविधाजनक है? ;-)

एक ही चाल को जावास्क्रिप्ट में अपने स्वाद के लिए और कार्य के आधार पर लागू किया जा सकता है।

उदाहरण के लिए (jQuery):

$( '.normal-class' ).click( function () { //
if ( $( 'html' ).hasClass( 'ie7' ) ) {
// - IE7
alert( ', !' );
} else {
// -
alert( ' !' );
};
});

* This source code was highlighted with Source Code Highlighter .


$( '.normal-class' ).click( function () { //
if ( $( 'html' ).hasClass( 'ie7' ) ) {
// - IE7
alert( ', !' );
} else {
// -
alert( ' !' );
};
});

* This source code was highlighted with Source Code Highlighter .


$( '.normal-class' ).click( function () { //
if ( $( 'html' ).hasClass( 'ie7' ) ) {
// - IE7
alert( ', !' );
} else {
// -
alert( ' !' );
};
});

* This source code was highlighted with Source Code Highlighter .


और इसी तरह। सामान्य तौर पर, यह सब है।

मुझे उम्मीद है कि कोई काम आएगा या कम से कम इसका आनंद लेंगे। यह मेरी पहली पोस्ट है, कड़ाई से न्याय न करें।

मेरे दोस्त और सोनोर बॉस को फंक्शन लिखने में उनकी मदद के लिए विशेष धन्यवाद और अवसर के लिए हाइब्रिडिट बनने के लिए मीफा।

आपका ध्यान के लिए धन्यवाद!