IT-ЗАМЕТКИ

Содержание

Поиск по id
Поиск по тегу

Поиск по id

Самый удобный способ найти элемент в DOM – это получить его по id. Для этого используется вызов document.getElementById(id)

<body>
    <div id="svgContainer">
        <svg id="elm" width="300" height="300">
            <circle cx="50" cy="50" r="20" fill="#000"/>
            <circle cx="100" cy="100" r="60" fill="#336699"/>
        </svg>
    </div>
    <script>
    window.onload = function() 
    {
        var root = document.getElementById('elm');
        var del = root.getElementsByTagName('circle')[1]
        root.removeChild(del)
    };
    </script>
</body>

Поиск по тегу

Следующий способ - это получить все элементы с определенным тегом, и среди них искать нужный. Для этого служит document.getElementsByTagName(tag). Она возвращает массив из элементов, имеющих такой тег.

<body>
    <div id="svgContainer">
        <svg id="elm" width="300" height="300">
            <g>
                <circle cx="50" cy="50" r="20" fill="#000"/>
                <circle cx="100" cy="100" r="60" fill="#336699"/>
                <g>
                    <circle cx="120" cy="30" r="20" fill="#816499"/>
                </g>
            </g>
            <g>
                <circle cx="30" cy="50" r="20" fill="#000"/>
            </g>
        </svg>
    </div>
    <script>
    window.onload = function() 
    {
        var root = document.getElementById('elm');
        var el = root.getElementsByTagName('g')[0].getElementsByTagName('g')[0].getElementsByTagName('circle')[0];
        el.setAttribute("fill","#ccc");
    };
    </script>
</body>

Получить всех потомков

elem.getElementsByTagName('*')

IT-ЗАМЕТКИ

Инструменты пользователя

Инструменты сайта

Содержание

Поиск по id

Поиск по тегу

Инструменты страницы