네이티브 자바 스크립트 선택

네이티브 자바 스크립트를 사용해야하며 둘 중 하나의 속성 (예 : 클래스와 아이디로 div)을 선택해야합니다. 여기 내가 지금까지 얻은 코드 샘플이 있습니다. 예제에는 모든 단일 선택 항목이 있습니다.네이티브 자바 스크립트 선택

var $ = function (selector) { 
var elements = []; 

var doc = document, i = doc.getElementsByTagName("div"), 
    iTwo = doc.getElementById("some_id"), // #some_id 
    iThree = doc.getElementsByTagName("input"), 
    //^Lets say I wanted to select an input with ID name as well. Should it not be doc.getElementsByTagName("input").getElementById("idname") 
    iFour = doc.getElementsByClassName("some_class"); // some_class 

elements.push(i,iTwo,iThree,iFour); 

return elements; 
    };

아 그래, 난 그것은 당신이 선택하려는 속성에 따라 달라집니다

출처

2014-01-30 Kald

'querySelector' /'querySelectorAll' – zerkms

^^ https://developer.mozilla.org/en-US/docs/Web/API/Document.querySelectorAll 사용할 수 – elclanrs

[querySelector/querySelectorAll] (https : //로 developer.mozilla.org/en-US/docs/Web/API/Document.querySelectorAll). CSS 선택기를 사용할 수 있습니다. 그러나 하단의 브라우저 호환성에 유의하십시오. –

... 나는 전혀 querySelector을 사용할 수 없습니다 언급하는 것을 잊었다. 예를 들어, 같은 개체를 전달할 수 있습니다

{tagname: 'div', class: 'foo'};

과 같은 기능이있을 수 있습니다 : 그것은 단순한 접근 방법이다 그러나

function listToArray(x) { 
    for (var result=[], i=0, iLen=x.length; i<iLen; i++) { 
     result[i] = x[i]; 
    } 
    return result; 
} 

function getByProperties(props) { 
    var el, elements; 
    var baseProps = {id:'id', tagName:'tagName'}; 
    var result = []; 

    if ('tagName' in props) { 
    elements = listToArray(document.getElementsByTagName(props.tagName)); 

    } else if ('id' in props) { 
    elements = [document.getElementById(props.id)]; 
    } 

    for (var j=0, jLen=elements.length; j<jLen; j++) { 
    el = elements[j]; 
    for (var prop in props) { 

     // Include all with tagName as used above. Avoids case sensitivity 
     if (prop == 'tagName' || (props.hasOwnProperty(prop) && props[prop] == el[prop])) { 
     result.push(el); 
     } 
    } 
    } 
    return result; 
} 

// e.g. 
getByProperties({tagName:'div', className:'foo'});

, 그것은 어린이나 n 번째 선택기 등의 작업을 수행하지 않습니다.

아마도 다른 사람의 선택기 기능 (주변에 몇 가지가 있음)을 살펴보고 포크를 따라 비 qSA 브라우저를 지원할 수 있습니다. 이들은 일반적으로 정규식을 사용하여 선택기를 토큰 화 한 다음 위와 비슷하지만 수동으로 선택기를 적용하는 방식을 기반으로합니다.

또한 값 (예 : tagName 값) 및 속성 이름에 대소 문자를 구분할 수 있으며 HTML 속성 이름을 DOM 속성 이름 (예 : class -> className, -> htmlFor 등)에 매핑 할 수도 있습니다.).

출처

2014-01-31 00:02:47 RobG

네이티브 자바 스크립트 선택

답변

관련 문제