Question

我正在定制一个wordpress主题，有一种情况是，当用户调整浏览器窗口大小时，页面上的文本内容应该改变它的颜色。我在一些独立的html页面中使用javascript成功完成了这个.Coming到wordpress主题，我发布了块的代码，我想从中获取文本并在此帖子下调整大小时动态更改其颜色。事情是内部跨度和

以下的元素类名“wpb_wrapper”没有，'id'或'class'选择器。没有选择器我的函数不识别内部html元素，我没有得到值。我甚至尝试了以下一些事情：

Firefox Xpath finder。（JS没有渲染!!）
document.select("span.wp_wrapper").get(0).nextElementSibling().text();
document.getElementById("item1").nextElementSibling.innerHTML

主题原始代码：

|<div class="wpb_wrapper">
			<span style="color: #000000;">Some Text</span><p></p>
<p><span style="color: #000000;">Some Text</span></p>
<p><span style="color: #000000;">Some Text</span>
		</p></div>

Answer 1

您可能想要更改wpb_wrapper类中的所有范围文本颜色，然后您必须编写以下选择器。

$('.wpb_wrapper span').css({'color': 'red'});

＆＃13;

$('.wpb_wrapper span').css({'color': 'red'});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="wpb_wrapper">
			<span style="color: #000000;">Some Text</span><p></p>
<p><span style="color: #000000;">Some Text</span></p>
<p><span style="color: #000000;">Some Text</span>
		</p></div>

＆＃13;

Answer 2

请考虑使用以下CSS：

使用!important

以覆盖HTML中存在的内联CSS属性（style="color: #000000;"）。

这种方法使用纯CSS而不需要JS。

.wpb_wrapper span   {color:green !important}

工作示例：

http://jsfiddle.net/8hxatjah/

有关!important here

上的CSS的更多信息

Answer 3

使用此

在Jquery

$('.wpb_wrapper span').css({'color': 'red'});

在css中

.wpb_wrapper span   {color:red !important}

Answer 4

您可以使用

访问HTML元素的子元素

$('.wpb_wrapper span')

或者，如果您正在使用自适应布局，则可以使用

@media screen and (max-width: 300px) {
   .wpb_wrapper span { color: #000000;}
}

Answer 5

稀释!!最后，这是使用Jquery

完成的

＆＃13;

$('.wpb_wrapper span').css({'color': 'red'});

＆＃13;

＆＃13; 感谢大家！！但是如何才能使用JavaScript完成..任何方式谢谢!!

Answer 6

$('.wpb_wrapper').find('span').text()您可以用来获取一个跨度值的span值。
因为div中有多个span元素。如果你想得到每个跨度值，请使用下面的代码

$（＆＃39; .wpb_wrapper＆＃39）找到（＆＃39;跨度＆＃39）。每一（功能（）{ $（本）的.text（）; }）;
如果您只需要多个跨度中的一个跨度值，请为每个跨度元素添加id。

如何获取内部<span>的值，除了父div值之外没有id或类选择器？</span>

6 个答案: