css 样式中 p[sel = "sel"] ?

[挥笔朝夕]

<script type="text/javascript">
$(function () {
var start = null;
$("p").click(function (e) {
// event 对象是 JavaScript 中一个非常重要的对象，用来表示当前事件。event 对象的属性和方法包含了当前事件的状态。
// 当前事件，是指正在发生的事件；状态，是与事件有关的性质，如 引发事件的DOM元素、鼠标的状态、按下的键等等
// event 对象只在事件发生的过程中才有效。
// 如果 event 随函数的参数传入，e 为真，eve=e；如果作为 window 对象的属性，window.event 为真，eve=window.event 。
// 改进上面获取鼠标坐标的代码，使它兼容所有浏览器：
e = e || event;
if (e.shiftKey) {
var si = $(start).index(),
ti = $(this).index();
var sel = $("p").slice(Math.min(si, ti), Math.max(si, ti) + 1);
//设置或返回被选元素的属性值
sel.attr("sel", "sel");
$("p").not(sel).removeAttr("sel");
return;
}
start = this;
if ($(this).attr("sel") == "sel") {
$(this).removeAttr("sel");
} else {
$(this).attr("sel", "sel");
}
})
})
</script>

[豪情]

这是准备散分？

[风中的少年]

那就把分接着吧。。。。。。。。

[forwardNow]

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    
<!--  
    <a href="#"></a> 的“href” 是HTML已经定义好的属性
    <p>中的 “data-username” 为自定义的属性，非标准的HTML属性
-->
<p data-username="zhangsan">zhangsan</p>

<p data-username="lisi">lisi</p>

<style>

/*
    下面都是css中的属性选择器
 */

    p[data-username] {
        width: 100px;
        height: 100px;
        border: dashed 1px #0795eb;
    }

    p[data-username='zhangsan'] {
        background-color: #d9534f;
    }
    p[data-username='lisi'] {
        background-color: #11534f;
    }

</style>


</body>
</html>