jquery和创建样式，如何检查样式是否已经存在

大家好，我四处看看，但似乎找不到我要找的答案

我有一个搜索页面，它进行ajax调用，返回json数据，然后根据返回的数据创建一个样式，并将其附加到DOM的部分。 样式的创建工作正常，但是如果进行了新的搜索，样式将被复制，因此my$（#element）.slidetoggle（）函数将被复制，并且slidetoggle将立即打开和关闭

ypu可在此处查看页面：

（用作伦敦北部和类别：墓地的测试数据） 如果进行两次相同的搜索，则结果的样式将被复制，并且幻灯片切换行为将被复制。）

我的问题是如何检查样式是否已经存在

创建样式的脚本如下所示：

function makeCSS(id){
        var myUrl = 'getBoroughInfo.php';
        $.ajax({
            url: myUrl,
            type: 'POST',
            data: 'myID='+id,
            dataType: 'json',
            error: function(xhr, statusText, errorThrown){
                // Work out what the error was and display the appropriate message
            },
            success: function(myData){
                var items = myData.boroughs[0];
                //console.log('borough: '+myData.boroughs);

                $("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px;  cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head");
                $("<style type='text/css'> #borough_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; } </style>").appendTo("head");
                $("<style type='text/css'> #searchHead_"+items.Borough_ID+"{ color:#000000; font-weight:bold; background-color:"+items.color+"; opacity: 1.0; cursor: pointer;} </style>").appendTo("head");
                //apply opacity
                //$('#borough_'+items.Borough_ID).css({});
                $('#borough_links').append('<div id="link_'+items.Borough_ID+'">'+items.Borough_Name+'</div>');
                $('#results').append('<div id="searchHead_'+items.Borough_ID+'">'+items.Borough_Name+'</div>');
                $('#results').append('<div id="borough_'+items.Borough_ID+'"></div>');
                $('#link_'+items.Borough_ID).live('click', function(){
                    $('#borough_'+items.Borough_ID).slideToggle('slow', function() {
                        // Animation complete.
                    });
                });
                $('#searchHead_'+items.Borough_ID).live('click', function(){
                    $('#borough_'+items.Borough_ID).slideToggle('slow', function() {
                        // Animation complete.
                    });
                });
            }
        });
    };

函数makeCSS（id）{
var myUrl='getBoroughInfo.php'；
$.ajax({
url:myUrl，
键入：“POST”，
数据：“myID=”+id，
数据类型：“json”，
错误：函数（xhr、状态文本、错误抛出）{
//找出错误并显示相应的消息
},
成功：函数（myData）{
var items=myData.boroughs[0]；
//log（'borough:'+myData.boroughs）；
$（“#link_”+items.Borough_ID+”{color:+items.color+”；字体大小：粗体；浮点：左；边距：10px；光标：指针；填充：1px；边框：1px实心“+items.color+”；}”）。附录（“标题”）；
$（“#borough_u”+items.borough_ID+”{color:“+items.color+”；字体大小：粗体；}”）.appendTo（“head”）；
$（“#searchHead_uu”+items.Borough_ID+”{color:#000000；字体重量：粗体；背景色：“+items.color+”；不透明度：1.0；光标：指针；}”）。附录（“head”）；
//应用不透明度
//$（'#borough'+items.borough_ID）.css（{}）；
$（“#borough_links”）.append（“”+items.borough_Name+“”）；
$（“#结果”）.append（“”+items.Borough#u Name+“”）；
$（“#结果”）。追加（“”）；
$（'#link'+items.Borough_ID）.live（'click'，function（））{
$（'#borough_u'+items.borough_uid）.slideToggle（'slow'，function（））{
//动画完成。
});
});
$（'#searchHead'+items.Borough_ID）.live（'click'，function（））{
$（'#borough_u'+items.borough_uid）.slideToggle（'slow'，function（））{
//动画完成。
});
});
}
});
};

这是创建我的一种样式的代码行：

$("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px;  cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head");

$（“#link_uu”+items.Borough_uid+”{color:+items.color+”；字体大小：粗体；浮动：左侧；空白：10px；光标：指针；填充：1px；边框：1px实心“+items.color+”；}”）。附录（“标题”）；

那么，我如何检查文档中是否已经存在此项？？？？

---

我认为一个简单的if语句就足以满足我的需要。

您可以使用：contains选择器。 e、 g:

if（$（“样式：包含（'#link_“+items.Borough_ID+”）））。长度<1）
{
$（“#link_”+items.Borough_ID+”{color:+items.color+”；字体大小：粗体；浮点：左；边距：10px；光标：指针；填充：1px；边框：1px实心“+items.color+”；}”）。附录（“标题”）；
}

为样式标记指定一个ID，并检查具有此ID的元素是否存在。但是为什么要动态添加样式呢？如果您可以控制HTML，为什么不直接添加样式呢？而且，

items.Borough_ID

对于每个请求总是不同的吗？如果不是，那就是你的问题。嘿，felix，谢谢你的回复，样式是动态添加的，因为db中有很多项目属于一个自治区，每个项目都有与之相关的不同颜色，并且有很多颜色，因此更容易根据需要生成样式，cybernates回答下面的代码示例有助于解决这个问题。虽然你的答案也会起作用，所以我增加了你的回复，谢谢你的输入，这么多在google上节省了我很多时间，这么简单的一行代码，正是我如此喜欢jquery的原因，尽管实际的问题是在代码块中复制了单击功能，而不是复制的样式，但是你的回答帮助我解决了这个问题，谢谢你的帮助：）

if($("style:contains('#link_" + items.Borough_ID + "')").length < 1)
{
    $("<style type='text/css'> #link_"+items.Borough_ID+"{ color:"+items.color+"; font-weight:bold; float:left; margin-left: 10px;  cursor: pointer; padding: 1px; border: 1px solid "+items.color+";} </style>").appendTo("head"); 
}