JavaScript入门（4）

最新推荐文章于 2024-03-13 19:40:46 发布

尉水风

最新推荐文章于 2024-03-13 19:40:46 发布

阅读量113

点赞数

分类专栏： JavaScript

本文链接：https://blog.csdn.net/smoggyxhdz/article/details/79354105

版权

JavaScript 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

DOM

document（文档）

object（对象）

model（模型）

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>shopping list</title>
    </head>
    <body>
        <h1>what to buy</h1>
        <p title="a gentle reminder">don't forgrt to buy this stuff.</p>
        <ul id="purchases">
            <li>a tin of beans</li>
            <li class="sale">cheese</li>
            <li class="sale important">milk</li>
        </ul>
    </body>
</html>

文本段落元素“p”，无序段落元素“ul”，列表项元素“li”

文本节点

<p>元素包含着文本“ don't forgrt to buy this stuff.”

属性节点

title="a gentle reminder"

1.class属性

可以在所有元素上任意应用class属性：

<li class="sale">cheese</li>
<li class="sale important">milk</li>

2.id属性

给网页里的某个元素加上一个独一无二的标识符

获取元素

alert(typeof document.getElementById("purchases"));

for(var i=0;i<document.getElementsByTagName("li").length;i++)
    alert(typeof document.getElementsByTagName("li")[i]);

var items = document.getElementsByTagName("li");
for(var i=0;i<items.length;i++)
    alert(typeof items[i]);

alert(document.getElementsByTagName("*").length);

通配符（星号字符“*”）必须放在引号里

var shopping = document.getElementById("purchases");
var sales = shopping.getElementsByClassName("sale");
alert(sales.length);

只要类名中包含sale就会被计算在内

var paras = document.getElementsByTagName("p");
for(var i=0;i<paras.length;i++)
{
    var title_text=paras[i].getAttribute("title");
    if(title_text)
        alert(title_text);
}

var shopping = document.getElementById("purchases");
alert(shopping.getAttribute("title"));
shopping.setAttribute("title","a list of goods");
alert(shopping.getAttribute("title"));

setAttributes做出的修改不会反应在文档本身的源代码中

尉水风

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JavaScript入门（4）

DOMdocument（文档）object（对象）model（模型）&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="utf-8"/&gt; &lt;title&gt;shopping list&lt;/title&gt; &
复制链接

扫一扫

专栏目录