宝哥软件园

javascript高级2 CSS XML学习

编辑:宝哥软件园 来源:互联网 时间:2021-10-10

CSS的全称是层叠样式表,中文名是层叠样式表,也叫层叠样式表。它的优点是可以使代码整洁,可以批量处理一些样式。基本语法:Annotation:/* */Selector:Selector { attributes : value }同一属性的值用空格符号隔开,不同的属性用分号隔开。区分大小写。例如,如果要自定义页面中表格的样式,请编写table {.}选择器的使用方法有很多,我就懒得再打了。我从网上复制了它们:选择器模式描述*匹配任何元素。(通用选择器)e匹配任何元素e(例如,e类型的元素)。(类型选择器)E F匹配元素E的任何后代元素F(后代选择器)E F匹配元素E的任何子元素F(子选择器)E:first-child匹配元素E,当它是其父元素的第一个子元素时。(:第一个子伪类)E:link E:visited如果e是尚未访问(:link)或已访问(:visited)的超链接的源锚点,则匹配元素e。(链接伪类)e : active e : hover e : focus在确定的用户操作中匹配e。(动态伪类)E:lang(c)如果e类型的元素使用(人类)语言c(文档语言决定如何确定语言),请匹配该元素。(:lang()伪类)E F如果一个元素E直接在元素F之前,那么元素F是匹配的。(相邻选择器)E[attr]将任何元素E与“attr”属性集匹配(无论其值如何)。(属性选择器)E[attr='warning']匹配任何“attr”属性值严格等于“warning”的元素E。(属性选择器)E[attr~='warning']匹配其“attr”属性值为空格分隔值列表且其中一个值严格等于“warning”的任何元素E。(属性选择器)E[lang|='en']匹配列表中“lang”属性的值以“en”开头的任何元素E(从左边开始)。(属性选择器)DIV .警告仅限HTML。用法与DIV[class~='warning']相同。(类选择器)E#myID匹配任何ID等于“myID”的元素E。(ID选择器)使用时详细说明。优先级:有时同一页面或CSS文件中同一元素有多个定义,需要根据优先级进行渲染。优先级分为外部定义的样式和其他样式。外部定义样式的优先级:我不想谈算法,这里简单说一下结果:id选择器类选择器属性选择器伪类选择器元素选择器伪元素选择器全局选择器其他样式定义的优先级:文本内样式,即style=.这是最高级别,优先于所有外部定义的样式。“重要”在不同的版本中,这个用法有偏差,所以我就不具体说了。必要时检查一下。继承获得的样式:这是优先级最低的样式。属性:请参考//www . JB 51 . net/w3school/CSS/CSS _ reference.htm(哎,这也太不负责任了!秋季)CSS单元://www . JB 51 . net/w3school/CSS/CSS _ units.htm(博主,你是个失败者!摔倒!(假装没听见)让我们进入申请环节( ̄︶ ̄) 1。在当前页面嵌入css样式:复制代码如下: HTML标题标题CSS测试/标题样式。表格样式{背景3360黄色;font-size :14 px;font-weight : bold;} /style /head body表宽=' 400 ' align=' center ' class=' tableStyle ' Tr TD title :/TD TD tdinput type=' text ' name=' title ' size=' 50 '/TD/Tr TD content :/TD TD text area name=' content ' class=' user data ' cols=' 45 ' row=' 10 '/text area/TD/Tr/tablebody 2。嵌入css样式文件:我们将在项目下创建一个新的css文件夹,然后创建一个名为style.css的新css文件这是为了使代码整洁。当然,因为这只是一个例子,所以我只写了刚才例子中的内容。

复制的代码如下:Tablestyle {背景:黄色;font-size :14 px;font-weight : bold;Border:1pxsolid # 00000很容易引用,只需添加一行:link rel='样式表' type=' text/css ' href=' CSS/style . CSS '/rel指定添加CSS样式表文件,type指定文件类型,href是文件的物理地址。3动态修改css样式。最后,我参与了js。这种修改方法无非是取元素,修改属性。值得一提的是,link的属性也是可以修改的。例如,编写一个id为myStyle的链接,然后修改它的导入文件。方法如下:复制的代码如下:linkrel='样式表' id=' mystyle ' type=' text/CSS ' href=' CSS/style . CSS ' script tyle=' text/javascript '//在JavaScript中修改时:varstyleobj=document . getelementbyid(' mystyle ')。styleObj .样式表.=//清除原始样式styleobj .样式表. addimport(' CSS/style 2 ');/script ok,然后开始XML部分(博主,你的节操是什么?如果你真的想详细学习xml,你可以开始另一个系列。所以,让我们在这里简单谈谈。xml的全称是可扩展标记语言,它的存在是为了更好、更灵活、更广泛地描述数据。用户几乎可以定义他的所有标签。例如,如果我们想存储一本书的一条信息,我们可以用不同的方式存储:复制代码如下:书名./姓名作者.作者/出版商./出版商/书!-or-book property name=' name ' value=' . '/propertyname=' author' value=' . '/property name=' publisher ' value=' . '/./bookxml还有几个死规则:必须有一个声明语句。xml证书='1.0 '?当然,还可以有编码等其他属性。的xml以外的所有元素都必须是封闭的,也就是说,必须用引号将/属性值括起来。将带有字母的名称区分大小写。“_”和“:”后面可以跟字母、数字、句点、冒号和下划线。只有一个根节点。Xpath是一种用于在XML文件中查找和定位信息的语言。它可以遍历树中的元素和属性。每个人都知道数字是什么。事实上,这里要讲的是xpath的语法。xpath语法见//www . JB 51 . net/w3school/XPath/XPath _ syntax.htm。请在上述网页参考手册的栏目中浏览XPath语法、XPath轴、XPath运算符、XPath函数。大致浏览后,可以开始这部分的练习:首先,给出一个xml文件:复制代码如下:-版权所有w3school.com.cn-!-W3School.com.cn书店示例-书店图书类别='儿童' title lang=' en ' Harry Potter/title AuthorJ k . Rowling/作者年份2005/年份价格29.99/价格/图书类别='烹饪' title lang=' en ' daily Italian/title AuthorGiada De Laurentiis/作者年份2005/年份价格30.00/价格/图书类别='web '封面='平装' title lang=' en ' learning XML/title AuthorErik t . Ray/作者年份2003/年份价格)在IE和FF的使用上略有不同,比较麻烦。让我们从IE开始:这段代码重申了脚本是在table后面编写的,否则它在编译js时不知道在哪里加载句子innerText,因为它还没有被渲染到table。

完整代码如下做参考:工业工程中的可扩展置标语言复制代码代码如下: html head title XML test/title/head body table width=' 400 ' border=' 1px ' align=' center ' tr TD width=' 30% '书名:/TD TD TD TD span id=' bname '/span/TD/tr TD tr span id=' Bau thor ' span/TD/tr/table script type=' text/JavaScript '!-var xmldoc=新的ActiveX对象(' MSXML 2 .domdocument。3.0');XML文档。加载(' XML/books。XML ');var name=xmldoc。选择节点('/书店/书籍/标题');var作者=xmldoc。选择节点('/书店/书籍/作者');var bname=文档。getelementbyid(' bname ');var Bau thor=文档。getelementbyid(' Bau thor ');bname.innerText=name[0].文本;bauthor.innerHTML='p '作者[0]。文本/p ';/////脚本正文/html接下来是消防的:复制代码代码如下: html head title XML test/title/head body table width=' 400 ' border=' 1px ' align=' center ' tr TD width=' 30% '书名:/TD TD TD TD span id=' bname '/span/TD/tr TD tr span id=' Bau thor ' span/TD/tr/table script type=' text/JavaScript '!-var xmldoc=文档。实施。创建文档(','',null);xmldoc。加载(' XML/books。XML ')//xmlDoc。评估(XPath,xmlDoc,命名空间,XPathResult .ANY_TYPE,XPahrResult);var赋值器obj=new XPathEvaluator();函数getBookChild(路径){ return evaluatorObj.evaluate(路径,xmldoc.documentElement,null,XPathResult .ORDERED_NODE_ITERATOR_TYPE,null);} var name list=GetBookChild('/书店/书籍/书名');var name=namelist。迭代NeXt();var作者列表=getBookChild('/书店/书籍/作者');var author=authorlist。迭代next();var bname=文档。getelementbyid(' bname ');var Bau thor=文档。getelementbyid(' Bau thor ');bname。innerhtml=名称。子节点[0].nodeValueBau thor。innerHTMl=作者。子节点[0].节点值/脚本体/html xml在消防中的读取网上的资源很少,我找了好多也没找到可以读到结点值的,于是我用调试在消防浏览器下观察了好久,终于找到了author.childNodes[0].节点值这一句XML。文件在火狐浏览器浏览器下的读取主要有两个类实现,一个是XPathEvaluator,XPathResult。其实就是用XPathEvaluator查找,然后在XPathResult里存储查找结果。可以看到我的代码里用XPathEvaluator查找的部分,那个函数评价的参数非常多,但是必须要了解这个函数才行,摘取下别人的东西(原内容点这里): 函数:求值(xpathText、contextNode、namespaceURLMapper、resultType、result)参数描述xpathText表示要计算的XPath表达式的字符串上下文节点。文档中,对应要计算的表达式的节点名称空间映射器把一个命名空间前缀映射为一个全称命名空间统一资源定位器的函数。如果不需要这样的映射,就为零。结果类型指定了期待作为结果的对象的类型,使用XPath转换来强制结果类型。类型的可能的值是XPathResult对象所定义的常量结果。一个复用的XPathResult对象;如果你要创建一个新的XPathResult对象,则为零。注意,结果类型有很多种参数值,继续抄来:返回类型说明任何类型把这个值传递给记录。评估()或XPathExpression.evaluate()来指定可接受的结果类型。属性结果类型并不设置这个值数字_类型数字值保存结果字符串_类型字符串值保存结果布尔型布尔值保存结果无序节点迭代器类型这个结果是节点的无序集合,可以通过重复调用迭代下一步()直到返回空来依次访问。在此迭代过程中,文档必须不被修改有序节点迭代器类型结果是节点的列表,按照文档中的属性排列,可以通过重复调用迭代下一步()直到返回空来依次访问。在此迭代过程中,文档必须不被修改无序节点快照类型结果是一个随机访问的节点列表快照长度。属性指定了列表的长度,并且快照项目()方法返回指定下标的节点。节点可能和它们出现在文档中的顺序不一样。

因为这个结果是一个“快照”,所以即使文档改变,它也是有效的。ORDERED_NODE_SNAPSHOT_TYPE结果是一个随机访问的节点列表,就像UNORDERED_NODE_SNAPSHOT_TYPE一样,只是列表是按照文档中的顺序排列的。any _ unordered _ node _ typesinglenoval属性引用与查询匹配的节点,如果没有匹配的节点,则为null。如果多个节点与查询匹配,单个节点值可以是任何匹配的节点。first _ ordered _ node _ typesinglenoval保存文档中与查询匹配的第一个节点,如果没有匹配的节点,则为null。(虽然是复制的,但是复制起来非常困难=w=)除了这些之外,xml文件节点其实还可以添加条件,比如只要第一个符合条件的节点是:/book/book[1]/title或者价格高于35:/book/book[price 35]/price,在前面的例子中,我想演示一下无条件返回所有子节点的效果。毕竟这里提到的一个概念叫做XSLT,是一种用来转换xml文档的语言,它的全称是可扩展样式表语言转换。XSLT XPath用于在xml文档中查找信息,可以将xml文档中存储的内容按照指定的样式显示为html页面。具体感兴趣的同学可以查一下,反正我没兴趣。()最后,xml的最后一个概念:数据岛实际上是指页面包含xml数据信息,和css一样,可以在内部进行镶嵌。方法是xml./xml也可以从外部导入:XML src=' http3360xml/books.xml '。通过datasrc,datafld来完成,但是我试了又试,但是没有代码可以运行,所以我们暂时先做一下,等我完成代码之后再回来补充。

更多资讯
游戏推荐
更多+