js给标签添加属性和值_jquery节点属性

一.节点操作

1.DOM内容节点操作:

​ ①innerHTML属性:设置或获取文本的内容(普通文本和标签)。

​ ②innerText属性:设置或获取文本的内容(普通文本),存在兼容性问题。

2.jQuery内容节点属性:

​ ①html([value])方法:设置或获取文本内容(普通文本和标签)。

​ ②text([value])方法:设置或获取文本的内容(普通文本),不存在兼容性问题。

二.jQuery属性操作

1.DOM的value属性

​ value属性:设置或获取表单元素(表单域和表单按钮)的默认值。

2.jQuery的val([value])方法

​ val([value])方法设置或获取表单元素(表单域和表单按钮)的默认值。

注:DOM中常用属性值来操作,而jQuery常用方法来操作。

3.DOM属性节点操作和jQuery属性节点操作的区别

1)DOM属性节点操作

​ ①把元素节点当做普通js对象来操作属性(点语法和中括号法)

​ 缺点:无法操作class属性

​ ②使用DOM提供的方法来操作

​ getAttribute("属性名")

​ setAttribute("属性名","属性值")

​ hasAttribute("属性名")

​ removeAttribute("属性名")

​ ③使用className来操作

注:采用的是覆盖操作

2)jQuery属性节点操作

​ ①采用attr()方法来操作属性

注:可以操作固有属性,也可以操作自定义属性。

​ a.获取属性

​ 语法:attr("属性名")

​ b.设置单个属性

​ 语法:attr("属性名","属性值");

​ c.设置多个属性

​ 语法:attr({

​ "属性名1":"属性值1",

​ "属性名2":"属性值2",

​ ...

​ });

​ d.删除属性

​ 语法:removeAttr("属性名")

4374420ebd99ce95744ca481732c16ba.png

​ ②采用prop()方法来操作属性

​ 注:主要用于操作固有属性,操作checked、selected和disabled属性,一定要有

​ prop()方法,不能用attr()方法。

​ a.获取属性

​ 语法:prop("属性名")

​ 作用:当属性名为:checked、selected时,如果选中状态时则返回true,则否

​ 返回false,当属性名为:disabled时,当禁用状态时返回true,否则返回false

​ b.设置属性

​ 语法:prop("属性名","属性值")

​ 作用:当属性名为:checked、selected时,设置的属性值如果为true,代表选

​ 中,否则代表没选中;当属性值为disable时,设置的属性值如果为true,代表

​ 禁用否则代表取消禁用。

注:如果属性值为boolean类型,那么可以不用双引号或单引号包裹。

​ c.删除属性

​ 语法:removeProp("属性名")

注:使用DOM或jQuery提供的方法来操作表单属性,操作完毕之后在标签上面

​ 不会有任何展示,使用DOM或jQuery所做的任何操作,都是在内存中做的操作。

​ ③专门为class属性提供的操作方法

​ a.添加class属性

​ 语法:addClass("class属性值");

注:jQuery提供添加class的方法做的是追加操作。

​ b.判断是否存在某个class属性值(返回的是Boolean类型值)

​ 语法:hasClass("class属性值");

​ c.删除class属性

​ 语法:removeClass(["class属性值"]);

注:如果没有参数,则代表删除所有的class属性值,

​ 如果有参数,代表删除指定的class属性值

​ d.切换class属性

​ 语法:toggleClass("class属性值");

注:如果标签中对应的“class属性值”存在,则删除

​ 如果标签中对应的“class属性值”不存在,则添加

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/349336.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

sci translate好用吗_228个学科分类对应12000+本SCI和SSCI期刊,总有你要的那款!

最近有很多小伙伴询问选刊的问题,而且都是非常具体的学科方向,我们的小编虽然非常热心且礼貌的回答“近期安排”,但其实我们也感觉到鸭梨山大:根据WOS最新一期(2020/9/21)名单公布,WOS目前总共收录了12266本…

arrays.sort(._Arrays.sort与Arrays.parallelSort

arrays.sort(.我们都使用Arrays.sort对对象和原始数组进行排序。 此API在下面使用合并排序或Tim排序对内容进行排序,如下所示: public static void sort(Object[] a) {if (LegacyMergeSort.userRequested)legacyMergeSort(a);elseComparableTimSort.sor…

适用于Idea的面向现代TDD的Java 8 JUnit测试模板(带有Mockito和AssertJ)

使用类似BDD的语法,Java 8和Mockito-AssertJ二重奏为Idea调整JUnit测试类模板。 本文涵盖的主题似乎很简单。 但是,根据我的培训师经验,我知道(不幸的是)这不是常见的做法。 因此,我决定写这篇简短的博客文…

Java编程字符逆序输出_用JAVA编写一程序:从键盘输入多个字符串到程序中,并将它们按逆序输出在屏幕上。...

展开全部代码如下:import java.util.Scanner;public class ScannerDemo{public static void main(String[] args) throws Exception{Scanner scannew Scanner(System.in);System.out.println("请输入内容:");String strscan.nextLine();char[]…

julia与python对比_有人说Julia比Python好,还给出了5个理由

选自medium作者:Emmett Boudreau机器之心编译参与:杜伟、张倩、肖清本文作者从速度、通用性、多重派发、适用于 ML 的程度和包管理器 5 个方面阐述了 Julia 语言相较于 Python 的优势所在。Julia 是一种多范式的函数式编程语言,用于机器学习和…

linkedhashmap获取第n个元素_机试真题分享——交换链表前后第K个元素

题目描述给定一个编码链表和一个加密条件K,对编码进行加密。加密规则:把编码从前往后开始数第K个元素和从后往前数第K个元素进行交换。注意:编码的长度为0.第一个编码的序号是1.示例:输入:[1 2 3 4 5 6] 2输出&#xf…

Spring Boot Admin –用于管理Spring Boot应用程序的Admin UI

作为微服务开发的一部分,我们许多人都将Spring Boot与Spring Cloud功能一起使用。 在微服务领域,我们将有许多Spring Boot应用程序将在相同/不同的主机上运行。 如果将Spring Actuator添加到Spring Boot应用程序中,我们将获得很多现成的端点来…

md5与des算法有何不同_Python算法详解:为什么说算法是程序的灵魂?

算法是程序的灵魂,只有掌握了算法,才能轻松地驾驭程序开发。软件开发工作不是按部就班,而是选择一种最合理的算法去实现项目功能。算法能够引导开发者在面对一个项目功能时用什么思路去实现,有了这个思路后,编程工作只需要遭循这个思路去实现即可。本章将详细讲解计算机算法的基…

高可用性(HA),会话复制,多VM Payara群集

抽象 在研究如何创建高可用性(HA)时,我发现了会话复制的多机Payara / GlassFish群集,无法在一个参考中找到所需的一切。 我认为这将是一个普遍的需求并且很容易找到。 不幸的是,我的假设是错误的。 因此,本…

如何快速弄懂一个新模型_如何评估创业项目是否靠谱?一个新的模型 | 创创锦囊...

要判断一个创业项目是否靠谱,是否能拥有广阔的市场和巨大的增长潜力,不仅是投资人关心的话题,更是每一个创业者在创业过程中不断思考的问题。投资人关注大趋势、大机会,遵循自上而下的思维模型,在心仪的赛道上寻找合适…

java编译找不到符号 int age=in.nexint()_Java报错找不到符号,小白自学求大佬解决...

import java.util.*;public class guess_1{public static void main(String[] args){Scanner innew Scanner(System.in);System.out.println("--------猜拳游戏--------");System.out.println("请出拳(1.剪刀 2.石头 3.布)");int personin.nextInt();int c…

Java命令行界面(第24部分):MarkUtils-CLI

本系列中有关使用Java解析命令行参数的第一篇文章介绍了Apache Commons CLI库。 这是本系列中介绍的基于Java的命令行解析库中最古老的,而且可能是最常用的之一。 Apache Commons CLI确实显示了它的时代,特别是与一些更现代的基于Java的命令行处理库相比…

view如何接受json_如何将你的 ThinkJS 项目部署到 ZEIT 上

编者按:本文作者奇舞团前端开发工程师李喆明。什么是 ZEITZEIT(https://zeit.co) 是免费的云平台,支持部署静态网站以及 Serverless 函数。Serverless 是近几年比较火的概念,简单去理解就是你只需要去实现具体的业务逻辑,而与最终…

Spring MVC和REST中@RestController和@Controller注释之间的区别

Spring MVC中的RestController注释不过是Controller和ResponseBody注释的组合。 它已添加到Spring 4.0中,以简化在Spring框架中RESTful Web Services的开发。 如果您熟悉REST Web服务,您就会知道Web应用程序与REST API之间的根本区别在于,Web…

java patriciatrie_明明白白以太坊Merkle Patricia Trie

在以太坊数据结构中,Merkle Patricia Trie始终是个绕不过去的坎,世界状态,交易,交易收据等都是以这种树的形式存储在区块链数据库中,并将树root hash保存在区块头里。可以说不弄懂这种树的原理就没有办法真正明白以太坊…

jdeveloper_适用于JDeveloper 11gR2的Glassfish插件

jdeveloper众所周知, ADF Essentials是使用Java构建Web应用程序的绝佳框架,它可以自由开发和部署。 您在Glassfish(3.1)服务器上部署ADF Essentials应用程序。 但是,JDeveloper并不带有嵌入式Glassfish服务器&#xff…

Spring Cloud教程– Spring Cloud Config Server简介

问题 SpringBoot在通过属性或YAML文件外部化配置属性方面提供了很大的灵活性。 我们还可以使用特定于配置文件的配置文件(例如application.properties , application-dev.properties , application-prod.properties等)分别为每个环…

数字孪生体技术白皮书_基于Flownex的数字孪生体解决方案 系列介绍之二:数据中心应用实例...

致力于数字孪生体技术的研究与发展通过解决方案和工程化应用造福人类来源:数字孪生体实验室原创作者:王永康转载请注明来源和出处导 读《基于Flownex的数字孪生体解决方案》是我们最近完成的系列落地方案之一。该方案适用于热力系统、冷却系统、通风空调…

node php聊天室,最简单的Nodejs聊天室示例

今天群里一个同学找我要一个nodejs聊天室的demo。给他了一个简单的例子,顺便记录下:准备工作(前提是已经装好了nodejs):mkdir nodejs-democd nodejs-demo安装express : npm install express安装socket.io : npm install socket.io安装foreve…

neo4j安装_neo4j 社区版win10 下安装

准备工作:Neo4j下载网址:https://neo4j.com/download-center/#releasesava jdk官网下载:https://www.oracle.com/technetwork/java/javase/downloads/index.html安装 查看是否有用旧版本的java jdk ,如果有请在设置“应用和功能”卸载 旧的ja…