博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jQuery快速入门基础教程之jQuery操作DOM(四)
阅读量:4116 次
发布时间:2019-05-25

本文共 2446 字,大约阅读时间需要 8 分钟。

问题我怎么才能收到你们公众号平台的推送文章呢?

答案只需要点击标题下面的蓝色字【web前端开发】关注即可。

text(), html()

text()用于设置或返回所选元素的文本内容

html()用于 设置或返回所选元素的内容(包括 HTML 标记)

格式:

$(selector).text(string)$(selector).html(string)

例子:

//点击id为btn1元素,  获取id为test1元素中的文本内容$("#btn1").click(function(){    $("#test1").text();});//点击id为btn1元素,  在id为test1元素中写入"Hello world"$("#btn1").click(function(){    $("#test1").text("Hello world!");});//点击id为btn2元素,  获取id为test2元素中的html文本$("#btn2").click(function(){    $("#test2").html();});//点击id为btn2元素,  在id为test2元素中写入"Hello world!"$("#btn2").click(function(){ $("#test2").html("Hello world!");});

val(), attr()

val() 用于设置或返回表单字段的值

attr() 方法也用于设置/改变属性值

格式:

$(selector).val(string)$(selector).attr(property,string)

例子:

//点击id为btn3元素, 获取id为test3表单元素中的文本内容$("#btn3").click(function(){	$("#test3").val();});//点击id为btn3元素, 设置id为test3表单元素 中的文本内容为"Dolly Duck"$("#btn3").click(function(){	$("#test3").val("Dolly Duck");});//点击id为btn4元素, 获取id为test4元素中的"href"属性值$("#btn4").click(function(){    $("#test4").attr("href");});//点击id为btn4元素, 设置id为test4元素中的"href"属性值 为"http://www.aseoe.com/"$("#btn4").click(function(){    $("#test4").attr("href", "http://www.aseoe.com/");});

append(), prepend()

append() 用于在被选元素的结尾插入内容。

prepend()用于在被选元素的开头插入内容

格式:

$(selector).append(string)$(selector).prepend(string)

例子:

//在p标签结尾插入文本 "Some appended text."$("p").append ("Some appended text.");//在p标签开头插入文本 "Some prepended text."$("p").prepend( "Some prepended text.");

append() 和 prepend() 方法能够通过参数接收无限数量的新元素。可以添加的包括text/HTML、jQuery 或者 

JavaScript/DOM 来创建的新元素

例子:

function appendText(){	var txt1=" Text. ";               // 以 HTML 创建新元素var txt2=$("

") .text("Text."); // 以 jQuery 创建新元素var txt3=document.createElement("p"); // 以 DOM 创建新元素txt3.innerHTML="Text.";$("p").append(txt1,txt2,txt3); // 追加新元素}

after(), before()

after() 方法在被选元素之后插入内容。

before() 方法在被选元素之前插入内容。

格式:

$(selector).after(string)$(selector).before(string)

例子:

//在img后插入文本"Some text after"$("img").after("Some text after");//在img前插入文本""Some text before"$("img").before("Some text before");

 

after() 和 before() 方法能够通过参数接收无限数量的新元素。可以添加的包括 text/HTML、jQuery 或者 JavaScript/DOM 来创建的新元素

function afterText(){var txt1="I ";                    // 以 HTML 创建新元素var txt2=$("

remove(), empty()

remove()用于 删除被选元素(其子元素)

empty()用于从被选元素中删除子元素

格式:

$(selector).remove(string)$(selector).empty()

例子:

//删除id为div1的元素$("#div1").remove();//删除 class="italic" 的所有 

元素$("p").remove(".italic");//删除id为div1元素内的所有子元素$("#div1").empty();

关注我们

转载地址:http://fzdpi.baihongyu.com/

你可能感兴趣的文章
显示器系列1--常见参数详解
查看>>
linux cpu显示信息
查看>>
显示器系列1-我常用设备的分辨率等
查看>>
vim常见操作
查看>>
linux性能监控工具汇总
查看>>
c++ new operator和operator new,delete operator和operator delete
查看>>
linux 信号机制
查看>>
linux 软件管理方式
查看>>
TCP有效带宽
查看>>
linux free命令输出详解
查看>>
[转]C++ 虚函数表解析
查看>>
C++ 对象的内存布局(上)
查看>>
C++ 对象的内存布局(下)
查看>>
浅谈多态基类析构函数声明为虚函数
查看>>
Android SDK Manager 无法更新问题解决
查看>>
python文件操作
查看>>
Java之线程
查看>>
Java之文件IO
查看>>
面试的一道机试题: 排序 难度(**)
查看>>
Windows编译OpenSSL
查看>>