Je souhaite ajouter une classe à une balise body avec jQuery.Comment ajouter un tag de classe à body?
Par exemple, si l'URL est http://www.mywebsite.com/about_us.asp, je veux ajouter les cinq premières lettres, dans ce cas, « à propos », la balise body:
<body class="about">
Comment puis-je faire cela?
Cela devrait le faire:
var newClass = window.location.href;
newClass = newClass.substring(newClass.lastIndexOf('/')+1, 5);
$('body').addClass(newClass);
L'ensemble "cinq caractères" la chose est un peu inquiétante; ce genre de coupure arbitraire est généralement un drapeau rouge. Je recommande tout attraper jusqu'à ce qu'un _ ou:.
newClass = newClass.match(/\/[^\/]+(_|\.)[^\/]+$/);
Ce modèle devrait générer:
../about_us.html: environ../something.html: quelque chose./has_two_underscores.html: aQuelque chose comme cela pourrait fonctionner:
$("body").attr("class", "about");
Il utilise jQuery de attr() pour ajouter la classe 'sur' au corps.
Cela fonctionne très bien pour ajouter une classe au corps. Je n'ai pas répondu à la question. – iCode
Eh bien, vous allez vouloir document.location. Faites une sorte de manipulation de chaînes (excepté si jQuery a une façon d'éviter que le travail pour vous), puis
$(body).addClass(foo);
Je sais que ce n'est pas la réponse complète, mais je suppose que vous pouvez travailler le reste sur:)
utilisation:
$(document.body).addClass('about');
Vous pouvez extraire cette partie de l'URL à l'aide d'un simple regular expression:
var url = location.href;
var className = url.match(/\w+\/(\w+)_/)[1];
$('body').addClass(className);
J'ai eu le même problème,
<body id="body">
Ajouter une étiquette d'identification du corps:
$('#body').attr('class',json.class); // My class comes from Ajax/JSON, but change it to whatever you require.
Ensuite, changez le classe pour le corps en utilisant l'identifiant. Cela a été testé dans Chrome, Internet Explorer et Safari.
plus efficace que $ ('body') est $ (document.body), évite le processus de sélection. Voir http://jsperf.com/jquery-body-vs-document-body-selector (remarque: 'higher is better' dans les stats données) –
$ (document.body) fonctionne aussi avec jQuery 1.9.0 (alors que $ ("body") ne fonctionne pas (testé dans Chrome)). –
Oh merci, j'essayais de faire ça et ça ne fonctionnait pas mais vous m'avez sauvé :) – Jerome