旅游网站模板改变网页元素内容

申请免费试用、咨询电话：400-8352-114

    在此之前，你已经看到javascript框架使用选择器和DOM遍历可以很容易的获得特定的元素。但是，为了改变 旅游网站模板上特定元素的内容和外观，你需要操作DOM并应用改变。使用纯粹的javascript将是一件繁重的工作，但幸运的是，大多数javascript框架提供有用的函数，可以很容易地做到这些。
    假设你有一个ID为the-box的盒子。
    <div id="the-box">Message goes here</div>
    使用jQuery将其文本改变为“Message goes here”，可以很简单的这样使用：
    $('#the-box').html('This is the new message!');
    事实上，你可以在函数中使用HTML代码，它能被浏览器解析，例如：
    $('#the-box').html('This is the <strong>new</strong> message!');
    在本例中，DIV元素中的内容看起来像这样：
    <div id="the-box">This is the <strong>new</strong> message!'</div>
    当然，在实例中你需要使用大于或小于等特殊字符，而不是指定特殊的HTML实体代码。你可以使用jQuery的text函数来代替：
    $('#the-box').text('300 >200');
    div元素更新后代码如下：
    <div id="the-box">300 > 200</div>
    在上面的例子中，现有的内容被替换为新的内容。如果你只想给文本附加一些信息该怎么办？幸运的是，jQuery提供append函数达到此目的。
    $('#the-box').append(', here goes message');
    对原始的div作如上操作后，div元素里的内容看起来是这样的：
    <div id="the-box">Message goes here, here goes message</div>
    除了追加，你可以在前面追加内容，将其插入到现存内容的前面而不是后面。此外，jQuery提供的函数可以在给定元素内插入内容，要么在前要么在后。还有函数替换内容、清空内容、移除元素、克隆元素等等。