jquery Learning-jquery Select child elements and number/get CSS Properties

• Selector Selector
• Select child element and CSS Properties
• Get the number of child elements

Selector Selector

The jquery selector is very powerful, so it's really handy when you can use jquery.

Select child element and CSS Properties

Let's look at the following code:

SelectColor = $(ColorId).children(‘svg‘).children(‘rect‘).css(‘fill‘);

This code is easy to understand. First of all:

Colorid = $ ("#id");
SVG is the label of a child element.
Rect is a sub-element under SVG
Fill is a CSS property of rect

You can see that I used two children because jquery can only select one layer of child elements at a time, not the more hierarchical.

Get the number of child elements

In fact, this is also very simple.
For example we have the following code:

<div class="box" id="C0" onclick="ChangeColor (' C0 ', ' #fe0000 ') ">                <svg width=" +" height=" viewPort" =  "0 0" version="1.1" xmlns="Http://www.w3.org/2000/svg" >             <rect x="6" y="6" width=" height " = "A" style="fill: #fe0000;" ></rect>        <polyline Fill="None" stroke= "Black" class=" Polylinehide " style=" Stroke-width:2 " points=" 2,16 2,30 16,30 "/> </polyline>        <polyline Fill="None" stroke= "Black" class=" Polylinehide " style=" Stroke-width:2 " points=" 16,2 30,2 30,16 "/> </polyline>    </svg></div>

This is an example of the HTML code. We want to get id = c0 the number of the following polyline: (should be 2) the code is as follows:

var polyNum = $(‘#co‘).children(‘svg‘).children(‘polyline‘);alert(polyNum.length);

This is the number of fetches.

jquery Learning-jquery Select child elements and number/get CSS Properties