मैं कैसे शुद्ध जावास्क्रिप्ट में jQuery की तरह का भी उपयोग करेंगे

Question

मैं है के लिए क्या देख:

var arrinput = $('input[name$="letter"]') 

कैसे मुझे लगता है कि jQuery शैली से एक शुद्ध जावास्क्रिप्ट शैली को बदल सकते हैं?

तो मुझे <input> टैग चाहिए जो name "अक्षर" के साथ समाप्त हो गया है।

---

मैं कोड कुछ बदल ... मेरी ब्राउज़र न समर्थन querySelector और FYI करें मैं सी # WinForms पर webbrowser घटक का उपयोग कर रहा

Answer 1

प्रयास करें:

var items = document.getElementsByTagName('input'); 
for (var i=0; i<items.length; i++) { 
    var item = items[i]; 
    if (/letter$/.test(item.name)) { 
     item.value = "A letter"; 
    } 
} 

Answer 2

आधुनिक ब्राउज़रों के लिए:

document.querySelector('input[name$=letter]');

पहला मैच लौटाएगा।

document.querySelectorAll('input[name$=letter]');

मैचों की एक सूची वापस आ जाएगी।

मुझे संदेह है कि यदि आप jquery स्रोत कोड देखते हैं, तो यह उपलब्ध होने पर document.querySelector[All] का उपयोग करता है।

Answer 3

यह एक पुरानी पोस्ट है, लेकिन मैंने एक समान समाधान की खोज की और मुझे यह नहीं मिला।

तो मैं एक छोटे से समारोह कर लिया है कि (यह optimizable है) करने के लिए:

/** 
* Searches and finds the parent node for a dom object 
* 
* @examples: 
* getParent(elem, 'div')     // The first div parent found 
* getParent(elem, 'div[id]')    // The first div parent with an id found 
* getParent(elem, 'div[id="toto"]')  // The first div parent with id equals toto found 
* getParent(elem, 'div[id=^="toto"]')  // The first div parent with id start by toto found 
* getParent(elem, 'div[id=$="toto"]')  // The first div parent with id end by toto found 
* getParent(elem, 'div[id=*="toto"]')  // The first div parent with id contains toto found 
* 
* @param domObject elem 
* @param string [target] 
* @return domObject or null 
*/ 
function getParent(elem, target) 
{ 
    if(target == null) 
     return elem.parentNode; 

    var elem_name = target, 
     attr_name = null, attr_value = null, 
     compare_type = null, 
     match_val = target.match(/\[.+[^\[\]]\]$/i); 

    if(match_val != null) 
    { 
     elem_name = elem_name.replace(match_val[0], ''); 

     var expr = match_val[0].substr(1, match_val[0].length-2), 
      tmp = expr.split('='); 

     attr_name = tmp[0]; 
     if(tmp.length == 2) 
     { 
      attr_value = tmp[1].toLowerCase(); 
      attr_value = attr_value.replace(/(\'|\")+/ig, ''); 

      if(attr_name.match(/\^$/)) 
       compare_type = 'begin'; 
      else if(attr_name.match(/\*$/)) 
       compare_type = 'all'; 
      else if(attr_name.match(/\$$/)) 
       compare_type = 'end'; 
      else 
       compare_type = 'simple'; 

      if(compare_type != 'simple') 
       attr_name = attr_name.substr(0, attr_name.length-1); 
     } 
    } 

    var parent = elem.parentNode; 

    do 
    { 
     if(parent.nodeName.toUpperCase() == elem_name.toUpperCase()) 
     { 
      if(attr_name != null) 
      { 
       var attribute = parent.getAttribute(attr_name).toLowerCase(); 
       if(attribute != null && attribute != '') 
       { 
        if(attr_value == null) 
         return parent; 

        if(compare_type == 'simple' && attribute == attr_value) 
         return parent; 
        if(compare_type == 'begin' && attribute.match(eval('/^'+attr_value+'/ig'))) 
         return parent; 
        if(compare_type == 'end' && attribute.match(eval('/'+attr_value+'$/ig'))) 
         return parent; 
        if(compare_type == 'all' && attribute.match(eval('/'+attr_value+'/ig'))) 
         return parent; 
       } 
      } else { 
       return parent; 
      } 
     } 

     parent = parent.parentNode; 
    } 
    while(parent != null); 

    return null; 
}