使用jQuery获取内部样式属性

时间:2019-01-10 09:29:23

标签: javascript jquery

我有html的这一部分,我只需要获取内部样式标签属性。但是html的下一部分可以更改结构。

<p class="Normal DocDefaults  data-selection ui-selectee selectable-disabled" style="border-color: #FFFFFF; border-style:solid; border-width:1px;background-color: #FFFFFF;margin-top: 0.07in;margin-bottom: 0.07in;">

<span style="color: #000000;font-style: italic;text-decoration: underline;;font-family: 'Arial';">Serialization is required for a variety of reasons. It is required to send across the state of an object over a network by means of a socket. One can also store an object’s state in a file. Additionally, manipulation of the state of an object as streams of bytes is required. The core of Java Serialization is the Serializable interface. When Serializable interface is implemented by your class it provides an indication to the compiler that java Serialization mechanism needs to be used to serialize the object.
</span>

</p>

我尝试使用element.attr(“ style”),但获得了外部

标签的style属性。 我可以用孩子找到这个吗?有什么建议吗?

3 个答案:

答案 0 :(得分:1)

您可以使用getComputedStyle,但它不是JavaScript,而不是jquery methood。

    androidExtensions {
      experimental = true
    } 

答案 1 :(得分:1)

您可以从内部元素check here中删除CSS

HTML:

  <p class="Normal DocDefaults  data-selection ui-selectee selectable-disabled" style="border-color: #FFFFFF; border-style:solid; border-width:1px;background-color: #FFFFFF;margin-top: 0.07in;margin-bottom: 0.07in;">

    <span style="color: #000000;font-style: italic;text-decoration: underline;;font-family: 'Arial';">Serialization is required for a variety of reasons. It is required to send across the state of an object over a network by means of a socket. One can also store an object’s state in a file. Additionally, manipulation of the state of an object as streams of bytes is required. The core of Java Serialization is the Serializable interface. When Serializable interface is implemented by your class it provides an indication to the compiler that java Serialization mechanism needs to be used to serialize the object.
    </span>

    </p>

jQuery代码:

var element= $('p').children().attr('style');
alert(element);

答案 2 :(得分:1)

根据您的情况,我提供了许多选项供您使用,如下所示:

如果只想使用第一个跨度孩子的样式标签

    console.log($('p').children('span').eq(0).attr('style'));

如果您想要每个孩子的内在风格

$('p').children().each(function() {
  console.log($(this).attr('style'));
 })

如果要使用跨度子项的内部样式

 $('p').children('span').each(function() {
    console.log($(this).attr('style'));
 })

以下是每种情况的可运行示例:

$(document).ready(() => {
 $('p').children().each(function() {
  // if you want inner style of each child
  console.log($(this).attr('style'));
 })
  $('p').children('span').each(function() {
   // if you want inner style of span child
   console.log($(this).attr('style'));
  })
  // if you want style tag of first span child only
    console.log($('p').children('span').eq(0).attr('style'));
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<p class="Normal DocDefaults  data-selection ui-selectee selectable-disabled" style="border-color: #FFFFFF; border-style:solid; border-width:1px;background-color: #FFFFFF;margin-top: 0.07in;margin-bottom: 0.07in;">

<span style="color: #000000;font-style: italic;text-decoration: underline;;font-family: 'Arial';">Serialization is required for a variety of reasons. It is required to send across the state of an object over a network by means of a socket. One can also store an object’s state in a file. Additionally, manipulation of the state of an object as streams of bytes is required. The core of Java Serialization is the Serializable interface. When Serializable interface is implemented by your class it provides an indication to the compiler that java Serialization mechanism needs to be used to serialize the object.
</span>

</p>