When choosing different colors and sizes in the shopping site, the text in the corresponding place changes as well.

Effect

1 <Divclass= "Colors">2               <Strong>Color:</Strong> <span>Blue White</span>3         </Div>4         <Divclass= "Colorimg">5           <ul>6                   <Li><imgsrc= "Images/pro_img/blue.jpg"alt= "Blue white" /></Li>7                   <Li><imgsrc= "Images/pro_img/yellow.jpg"alt= "Yellow" /></Li>8                   <Li><imgsrc= "Images/pro_img/green.jpg"alt= "Green white" /></Li>9                 </ul>Ten           </Div><!--choose a different color - One           <Divclass= "Size"> A               <Strong>Size:</Strong> <span>Not selected</span> -         </Div> -         <Divclass= "Sizetype"> the               <ul> -                   <Li>S</Li> -                   <Li>L</Li> -                   <Li>Sl</Li> +                   <Li>LL</Li> -               </ul> +           </Div><!--Choose a different size -

$(function() {          varcolor_list=$ (". Colorimg ul li img"); Color_list.click (function(){        vartext=$ ( This). attr ("Alt"); $(". Colors span"). html (text); });//text changes when you choose a different color                varsize_list=$ (". Sizetype ul Li"); Size_list.click (function(){        vartext=$ ( This). html (); $(". Size span"). html (text); });//text changes when you choose a different size});

其中attr()The function of a method is to set or return the attributes of an element, where the attr(属性名) format is the value that gets the attribute name of the element, and the attr(属性名，属性值) format is the value that sets the attribute name of the element.

When choosing different colors and sizes in the shopping site, the text in the corresponding place changes as well.