javascript - 使用 jQuery 选择和替换嵌入式样式

Question

是否可以使用 jQuery 选择和替换嵌入式样式背景路径？我无法让它正常工作。

<script>
$(document).ready(function($) {

function myReplaceFunc() {
    var $str = $('style'); 
    $str.replace('wcsstore', 'mytest');
}

myReplaceFunc();

});
</script>

<style>
#test{
background: url("/wcsstore/***/en_GB/images/suppliershop/ecomheader.jpg");
}
</style>

<section id="test">Test 1</section>
<section id="test2">Test 2</section>

非常感谢任何帮助。

Answer 1

除了调用 replace() 的问题在 jQuery 对象上，您的方法是有缺陷的。虽然可以修改 <style> 的内容用 JS 标记，这离最好的解决方案还很远。

相反，您应该设置 background-image在元素上直接使用 css()方法。您可以为此方法提供一个函数，该函数接收当前值作为参数。然后您可以调用 replace()就此 - 就像你现在一样 - 更新值(value)。试试这个:

$(document).ready(function($) {
  function myReplaceFunc() {
    $('#test').css('background-image', function(i, bg) {
      return bg.replace('wcsstore', 'mytest');
    });
  }

  myReplaceFunc();
});

#test {
  background: url("/wcsstore/***/en_GB/images/suppliershop/ecomheader.jpg");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<section id="test">Test 1</section>
<section id="test2">Test 2</section>