Search the Community

Please consider the following code and answer the question. Please do not omit your reasons for answering as you did. CODE SYNOPSIS: This handy piece of code places a constraint on the number of words that can be placed in a selected <textarea> element. In addition, it displays the current status of the selected element as one enters text. This code, less the iterative aspect, has been tested for one <textarea> element, but I wish now to expand it to include many <textarea> elements. In order to do this I created a mixed associative array (see below) whose data I use to select each <textarea> element and apply a different constraint. Although I have identified each <textarea> element by its unique id='' attribute I have used the class='' attribute to display the current status of the selected <textarea> element. My motivation for doing this latter is, of course, one of efficiency. My belief is that specific overrides general, and that the values generated by the id='' attribute will override those designated by the class='' attribute -- a designation that is common to all <textarea> elements. QUESTION: Is this sound Javascript programming logic? Or, must I change the class='' attributes to the same id='' attribute for each <textarea> element? <?php foreach($wordmax as $textarea => $arr) { $area_id = $arr['id']; $max = $arr['length']; $($area_id).on('keydown', function(e) { var words = $.trim(this.value).length ? this.value.match(/\S+/g).length : 0; if (words <= $max) { $('.display_count').text(words); $('.words_remaining').text($max-words); }else{ if (e.which !== 8) e.preventDefault(); } }); } ?> <textarea id='letter_body' name='letter_body'>...</textarea><br /> Word Count: <span class='display_count'>0</span> Words Remaining: <span class='words_remaining'>0</span> <textarea id='letter_abstract' name='letter_abstract'>...</textarea><br /> Word Count: <span class='display_count'>0</span> Words Remaining: <span class='words_remaining'>0</span> $wordmax = array( 'letter_abstract' => array ( 'id' => '#letter_abstract', 'length' => '150' ), 'letter_body' => array ( 'id' => '#letter_body', 'length' => '800' ), . . . 'student_bio' => array ( 'id' => '#student_bio', 'length' => '400' ), );

I learnt that there are 5 type of selectors. Id selector class selector grouped selector context selector, element selector In grouped selector is it possible to use only ELEMENTS seperated with comma. Can this code be considered as a grouped selector. {#form input,#form textarea{border:2px solid blue;} Also what's the difference of context selector and grouped selector?

element element div p Selects all <p> elements inside <div> elements 1 element>element div>p Selects all <p> elements where the parent is a <div> element 2 So, what's the difference between this two selectors? Seems that inside and parent is the same isn't?