如何向body标记添加类?

时间:2022-11-25 20:10:39

I want to add a class to a body tag with jQuery.

我想用jQuery向body标记添加一个类。

For example if the URL is http://www.mywebsite.com/about_us.asp, I want add the first five letters, in this case 'about', to the body tag:

例如,如果URL是http://www.mywebsite.com/about_us.asp,我想将前五个字母(在本例中是“about”)添加到body标记中:

<body class="about">

How can I do that?

我怎么做呢?

7 个解决方案

#1


41  

This should do it:

这应该这样做:

var newClass = window.location.href;
newClass = newClass.substring(newClass.lastIndexOf('/')+1, 5);
$('body').addClass(newClass);

The whole "five characters" thing is a little worrisome; that kind of arbitrary cutoff is usually a red flag. I'd recommend catching everything until an _ or .:

整个“五个字”的事情有点令人担忧;这种任意的截止通常是一个危险信号。我建议你把所有的东西都抓起来。

newClass = newClass.match(/\/[^\/]+(_|\.)[^\/]+$/);

That pattern should yield the following:

这种模式应该产生以下结果:

  • ../about_us.html : about
  • . . / about_us。html:大约
  • ../something.html : something
  • . . /。html:
  • ../has_two_underscores.html : has
  • . . / has_two_underscores。html:

#2


11  

Use:

使用:

$(document.body).addClass('about');

#3


2  

You can extract that part of the URL using a simple regular expression:

您可以使用一个简单的正则表达式提取URL的这一部分:

var url = location.href;
var className = url.match(/\w+\/(\w+)_/)[1];
$('body').addClass(className);

#4


0  

$('body').toggleClass("className")

perfectly works

完美的作品

#5


-1  

Well, you're going to want document.location. Do some sort of string manipulation on it (unless jQuery has a way to avoid that work for you) and then

你需要document。location。对它进行某种字符串操作(除非jQuery有办法避免这种操作),然后呢

$(body).addClass(foo);

I know this isn't the complete answer, but I assume you can work the rest out :)

我知道这不是完整的答案,但我想你可以算出其余的:

#6


-3  

Something like this might work:

像这样的东西可能会起作用:

$("body").attr("class", "about");

It uses jQuery's attr() to add the class 'about' to the body.

它使用jQuery的attr()将类“about”添加到主体中。

#7


-4  

I had the same problem,

我也有同样的问题,

<body id="body">

Add an ID tag to the body:

向正文添加ID标签:

$('#body').attr('class',json.class); // My class comes from Ajax/JSON, but change it to whatever you require.

Then switch the class for the body's using the id. This has been tested in Chrome, Internet Explorer, and Safari.

然后使用id为主体切换类,这已经在Chrome、Internet Explorer和Safari中进行了测试。

#1


41  

This should do it:

这应该这样做:

var newClass = window.location.href;
newClass = newClass.substring(newClass.lastIndexOf('/')+1, 5);
$('body').addClass(newClass);

The whole "five characters" thing is a little worrisome; that kind of arbitrary cutoff is usually a red flag. I'd recommend catching everything until an _ or .:

整个“五个字”的事情有点令人担忧;这种任意的截止通常是一个危险信号。我建议你把所有的东西都抓起来。

newClass = newClass.match(/\/[^\/]+(_|\.)[^\/]+$/);

That pattern should yield the following:

这种模式应该产生以下结果:

  • ../about_us.html : about
  • . . / about_us。html:大约
  • ../something.html : something
  • . . /。html:
  • ../has_two_underscores.html : has
  • . . / has_two_underscores。html:

#2


11  

Use:

使用:

$(document.body).addClass('about');

#3


2  

You can extract that part of the URL using a simple regular expression:

您可以使用一个简单的正则表达式提取URL的这一部分:

var url = location.href;
var className = url.match(/\w+\/(\w+)_/)[1];
$('body').addClass(className);

#4


0  

$('body').toggleClass("className")

perfectly works

完美的作品

#5


-1  

Well, you're going to want document.location. Do some sort of string manipulation on it (unless jQuery has a way to avoid that work for you) and then

你需要document。location。对它进行某种字符串操作(除非jQuery有办法避免这种操作),然后呢

$(body).addClass(foo);

I know this isn't the complete answer, but I assume you can work the rest out :)

我知道这不是完整的答案,但我想你可以算出其余的:

#6


-3  

Something like this might work:

像这样的东西可能会起作用:

$("body").attr("class", "about");

It uses jQuery's attr() to add the class 'about' to the body.

它使用jQuery的attr()将类“about”添加到主体中。

#7


-4  

I had the same problem,

我也有同样的问题,

<body id="body">

Add an ID tag to the body:

向正文添加ID标签:

$('#body').attr('class',json.class); // My class comes from Ajax/JSON, but change it to whatever you require.

Then switch the class for the body's using the id. This has been tested in Chrome, Internet Explorer, and Safari.

然后使用id为主体切换类,这已经在Chrome、Internet Explorer和Safari中进行了测试。