How can I decrease values of HTML fields with jQuery?

3

I have a class in PHP that captures the URL of an external site, this site itself returns me a HTML in the template:

<div id="isOffered">      
    <a class="price  " href="javascript:;">
        <span class="priceText wide  UK">33/20</span>
        <span class="priceText wide  EU">2.65</span>
        <span class="priceText wide  US">+165</span>
        <span class="priceText wide  CH">2.65</span>
        <span class="priceChangeArrow" ></span>
        <input type="hidden" class="betCode" value="0]SK@95553201@362904182@NB*33~20*0*-1*0*0"/>
        <input type="hidden" class="decValue" value="2.65"/>
        <input type="hidden" class="originalBetCode" value="0]SK@95553201@362904182@NB*33~20*0*-1*0*0"/>
     </a>
   </div></div>
                  <div id="s_362904184" class="odds draw suspended">   <div id="isNotOffered" class="hide">    
    <span class="price priceReadonly"></span>
   </div>

   <div id="isOffered">   
    <a class="price  " href="javascript:;">
        <span class="priceText wide  UK">19/10</span>
        <span class="priceText wide  EU">2.90</span>
        <span class="priceText wide  US">+190</span>
        <span class="priceText wide  CH">2.90</span>
        <span class="priceChangeArrow" ></span>
        <input type="hidden" class="betCode" value="0]SK@95553201@362904184@NB*19~10*0*-1*0*0"/>
        <input type="hidden" class="decValue" value="2.90"/>
        <input type="hidden" class="originalBetCode" value="0]SK@95553201@362904184@NB*19~10*0*-1*0*0"/>
     </a>
   </div></div>
                  <div id="s_362904183" class="odds away suspended">   <div id="isNotOffered" class="hide">    
    <span class="price priceReadonly"></span>
   </div>

With PHP , using DOMDocument() and DomXpath() , I search for the values of the <span> tags, decrease the values to 20% of the original, get the value of the input betCode , and I change the values between '~' , since they are the divisors responsible for the values in javascript, in PHP a friend here in the forum, in time ago helped me to do in PHP .

But I started to study jQuery , and I saw that I can capture the URL of the site with it, without the need of PHP , so I did something simple, I got the original site address and replaced with URL of my server where the values are being decreased, I did so:

$('input[value="/services/CouponTemplate.mvc/GetCoupon"]').attr('value', function(_, href){
    return "https://enderecodomeuserver.com/parser.php?url=" + href;
}); 

and it works perfectly, but my question is: would I have to do the same process of decreasing values using jQuery ? As if before return , I made the decreases using the client browser without having to load the server. Does jQuery have something similar to DOMdocument ?

    
asked by anonymous 17.06.2015 / 18:17

1 answer

1

To get the values using jQuery the syntax looks something like this:

var valor1 = $("#seletorUsandoIdDoSpan").text();
var valor2 = $(".seletorUsandoClasseDoSpan").text();
// caso o valor esteja em um input voce deve usar .val() ao inves de .text();

var soma = parseFloat(valor1) + parseFloat(valor2);

NOTE:

You will have to start differentiating your tags with a unique ID (listed for example: priceUK1, priceUK2) or classes that are inside a container with a unique ID.

Otherwise it will be hard for you with jQuery to find the value you want because it uses selectors, and somehow this selector has to search for just one element.

Example:

    <div id="isOffered1">      
        <a class="price  " href="javascript:;">
            <span class="priceText wide  UK">33/20</span>
            <span class="priceText wide  EU">2.65</span>
            <span class="priceText wide  US">+165</span>
            <span class="priceText wide  CH">2.65</span>
            <span class="priceChangeArrow" ></span>
            <input type="hidden" class="betCode" value="0]SK@95553201@362904182@NB*33~20*0*-1*0*0"/>
            <input type="hidden" class="decValue" value="2.65"/>
            <input type="hidden" class="originalBetCode" value="0]SK@95553201@362904182@NB*33~20*0*-1*0*0"/>
         </a>
       </div>
    </div>
    <div id="s_362904184" class="odds draw suspended">   <div id="isNotOffered" class="hide">    
        <span class="price priceReadonly"></span>
    </div>

    <div id="isOffered2">   
        <a class="price  " href="javascript:;">
            <span class="priceText wide  UK">19/10</span>
            <span class="priceText wide  EU">2.90</span>
            <span class="priceText wide  US">+190</span>
            <span class="priceText wide  CH">2.90</span>
            <span class="priceChangeArrow" ></span>
            <input type="hidden" class="betCode" value="0]SK@95553201@362904184@NB*19~10*0*-1*0*0"/>
            <input type="hidden" class="decValue" value="2.90"/>
            <input type="hidden" class="originalBetCode" value="0]SK@95553201@362904184@NB*19~10*0*-1*0*0"/>
         </a>
       </div>
    </div>
    <div id="s_362904183" class="odds away suspended">   <div id="isNotOffered" class="hide">    
        <span class="price priceReadonly"></span>
    </div>

With two containers with different ids: isOffered1 and isOffered2 you can already differentiate your values using jQuery. Example:

var valor1 = $("#isOffered1 .priceText.EU").text(); // output: "2.65"
var valor2 = $("#isOffered2 .priceText.EU").text(); // output: "2.90"
var soma = parseFloat(valor1) + parseFloat(valor2); // output: "5.55"
    
18.06.2015 / 15:37